Javascript/jquery if語句和hasClass

我有一堆圖像的不透明度爲80％。
當我將鼠標懸停在圖像上時，我使用mouseenter和fadeTo('fast' 1);來使不透明度達到100％。
當我將鼠標懸停在圖像上時，我使用mouseleave和fadeTo('fast' 0.8);將不透明度恢復爲80％。但是，如果我懸停的圖像有一個特定的類，我希望不透明度保持100％，並在鼠標離開時不變爲80％。Javascript/jquery if語句和hasClass

我試過但失敗了，希望你們能幫助我！

$(document).ready(function(){ 

var subject = 'null'; 

$('.subject').mouseenter(function(){ 
    if ($(this).hasClass(subject) == false) { 
     $(this).find('.info').fadeTo('fast', 1); 
     $(this).find('img').fadeTo('fast', 1); 
    } 
}); 
$('.subject').mouseleave(function(){ 
    if ($(this).hasClass(subject) == false { 
     $(this).find('.info').fadeTo('fast', 0); 
     $(this).find('img').fadeTo('fast', 0.8); 
    } 
}); 


$('.english-link').click(function(){ 
    $('.english').find('.info').fadeTo('fast', 1); 
    $('.english').find('img').fadeTo('fast', 1); 
    var subject = 'english'; 
}); 
$('.math-link').click(function(){ 
    $('.math').find('.info').fadeTo('fast', 1); 
    $('.math').find('img').fadeTo('fast', 1); 
    var subject = 'math'; 
}); 
$('.electives-link').click(function(){ 
    $('.electives').find('.info').fadeTo('fast', 1); 
    $('.electives').find('img').fadeTo('fast', 1); 
    var subject = 'electives'; 
});

}）;

http://jsfiddle.net/JDfpc/

來源

2013-03-18 Brett Merrifield

被稱爲null的CSS類？您的mouseleave回調中的第二行也有語法錯誤。您在if語句中缺少右括號。 – 2013-03-18 14:25:29

你如何製作一個[jsfiddle]（http://jsfiddle.net/）包含你到目前爲止？ – adamb 2013-03-18 14:26:15

我貼了一個小提琴。 – 2013-03-18 14:42:25

-2

你有語法錯誤，請嘗試用這種

$('.subject').mouseenter(function(){ 
if (($(this).hasClass('subject')) == false) { 
    $(this).find('.info').fadeTo('fast', 1); 
    $(this).find('img').fadeTo('fast', 1); 
    } 
});

check here

來源

2013-03-18 14:26:44 Nikhar

該元素將始終具有「subject」類，因爲這是您選擇的內容。 – 2013-03-18 14:27:50

我指出語法錯誤..邏輯之後。 – Nikhar 2013-03-18 14:28:24

你已經通過讓'subject'成爲一個字符串而不是一個變量來引入邏輯錯誤。你的例子中也有不必要的括號，這使得它很難閱讀。 – 2013-03-18 14:30:46

您可以在功能淡出你的形象使用:not jQuery選擇，像$('.math:not(.otherclass)').doSomething()

http://api.jquery.com/not-selector/

來源

2013-03-18 14:27:20 Lemurr

正如你打算在subject var函數中淡出，你必須使其全球化。

就目前而言，你重新聲明每次subject與var，使您的mouseenter和mouseleave的範圍內，subject沒有改變。

var globals = {};   //Your global array 

$(document).ready(function(){ 

    globals.subject = 'null'; //Subject is accessible everywhere in your code now 

    ... 



    $('.english-link').click(function(){ 
     $('.english').find('.info').fadeTo('fast', 1); 
     $('.english').find('img').fadeTo('fast', 1); 
     globals.subject = 'english'; 
    }); 
}

查看updated fiddle的工作示例。

注意：您還可以使用HTML 5 localStorage來存儲主題，如localStorage.subject = 'english'。

來源

2013-03-18 14:33:16 Bigood

爲什麼讓它成爲全球？爲什麼不將它設置爲外部DOM準備回調的本地？這樣它將不會污染全局名稱空間，但仍將在示例中的所有函數的範圍內。 – 2013-03-18 14:36:49

@ChristoferEliasson我知道第二個命題污染了全局命名空間;但第一個呢？ – Bigood 2013-03-18 14:39:55

至少第一個示例將所有全局變量保存在一個全局對象中，但我沒有看到將它變爲全局變量的要點，除非您確實需要訪問代碼的其他部分中的變量，但尚未在這裏陳述。如果你需要訪問其他地方的變量，我仍然會說全局變量很少是要走的路。設置一些共享作用域可能會更好，或者在需要時將該變量傳遞給該方法。全局變量很容易造成混亂。 – 2013-03-18 14:45:36

$(#subject).hover(function() { 
     (this).fadeTo('fast', 1) 
}, function() { 
     if(this).hasClass("subject") { 
      (this).css('opacity','1'); 
     } 
     else if { 
      (this).fadeTo('fast',.8) 
     } 
    } 
});

來源

2013-03-18 14:35:29

Javascript/jquery if語句和hasClass

回答

相關問題