2013-02-26 101 views
1

我是jQuery的新手,但我已經對它的力量印象深刻。我的問題是:jquery if else語句hasClass addClass點擊

我想

  • 添加class='dec'#jf1當我點擊它,如果它有class='undec'
  • 添加class='undec'#jf1當我點擊它,如果它有class='dec'

這是我的 - 它不工作!

<script> 
$(document).ready(function(){ 
$(function() { 

    $('#jf1').click(function() { 

     if ('#jf1'.hasClass("undec")) { 
      $('#jf1').toggleClass("undec dec"); 
    } 
     else if ('#jf1'.hasClass("dec")) { 
      $('#jf1').toggleClass("dec undec"; 
    } 

    }); 

}); 
}); 
</script> 
+1

爲什麼您使用的$(document)和$(功能)兩者一起後,再次需要的功能? – 2013-02-26 08:12:06

回答

6

有幾個語法錯誤在你的代碼,你的if語句應該是:

if ($('#jf1').hasClass("undec")) { 

而且$(function(){})$(document).ready(function(){})簡寫版,你不應該巢他們。 toggleClass刪除並添加類,因此在此處不需要使用if語句。

$(function() { 
    $('#jf1').click(function() { 
     // `this` refers to the clicked element 
     $(this).toggleClass("undec dec"); 
    }); 
}); 
+0

嘿,謝謝你的快速回復。 我同意.toggleClass對此非常完美 - 但我想要使用if/else語句,因爲當我單擊該項目時,我還想要.show或.hide基於其CSS類的元素,基於是或不是「過濾器」有class ='dec'或class ='undec' – user2110307 2013-02-26 08:47:27

0

試試這個:http://jsfiddle.net/YS5F5/

$(document).ready(function() { 
    $('#jf1').click(function() { 
     alert("hello"); 
     $('#jf1').toggleClass("undec"); 
     $('#jf1').toggleClass("dec"); 

    }); 
}); 

不jQuery的(文件)。就緒部分