jQuery無法定位切換類

-1

我是jQuery的新手，我可能會以這種錯誤的方式進行。我正在嘗試鎖定已被切換的div。第一個事件處理程序工作正常（打開），但我無法讓第二個工作（關閉）。任何幫助將不勝感激。jQuery無法定位切換類

$(".entry .tog").unbind(); 
    $(".entry .tog").click(function(){ 
     $(this).closest(".entry").toggleClass("entry-active entry"); 
     $(".entry").toggleClass("entry not-active"); 

     alert("open"); 
}) 

$(".entry-active .tog").unbind(); 
    $(".entry-active .tog").click(function(){ 
     $(this).closest(".entry-active").toggleClass("entry-active entry"); 
     $(".not-active").toggleClass("not-active entry"); 

     alert("close"); 
    }) 
});

來源

2013-01-08 Randall987

你可以添加一個[JSFiddle]（http://jsfiddle.net/）嗎？ – Wolf

你的未綁定的目的是什麼？ –

要切換，您通常只需要一個類和一個點擊處理程序。當然，您可以切換多個類，但對於相同的元素集合，您仍然只需要一個點擊處理程序。 –

我希望你要實現這一點：

$(".entry .tog").off('click').on('click', function() { 
    var $entry = $(this).closest(".entry").toggleClass("active"); 
    $(".entry").not($entry).removeClass("active"); 
    alert($entry.hasClass('active') ? "active" : "not active"); 
});

注：

有有兩個班在反相工作是沒有意義的。無論是CSS樣式還是jQuery選擇，每個方面都足夠了。您不希望切換類entry。如果你這樣做了，第一次entry被切換（即該類被移除），元素將變得不可再選擇$(".entry")。有一天，這可能是可取的，但不是在這裏，我懷疑。

來源

2013-01-08 22:28:08

太棒了！它工作完美。謝謝你的注意事項。 – Randall987

蘭德爾，如果你對答案感到滿意，那麼接受它就是一個協議。有一個複選框或按鈕或頁面上的某個地方，只有你可以看到。 –

所有這些都是我真正強調的要點，我個人認爲它應該是公認的答案。我解釋了爲什麼被試過的方式打破了我在答案中的做法，但我想強調這是一個更好的整體方法，而我的構造更多地針對事件綁定問題的教學=） – taswyn

這段代碼是不是隻是將它設置爲活動狀態，然後不活動。

$(this).closest(".entry").toggleClass("entry-active entry"); 
$(".entry").toggleClass("entry not-active");

來源

2013-01-08 22:20:52

我不太確定我看到一個指向你的綁定，特別是因爲他們只會運行一次（他們沒有附加到任何事件處理程序或從你發佈的任何其他東西）。

我傾向於贊同@ Beetroot-Beetroot的回答，即不要試圖強迫他們互相切換。但在學習方面，我會指出你試圖做的事情的根本問題。

您的基本問題是您在運行時直接綁定這些元素。發生什麼事是一旦你的click綁定被設置，那就是：即使你改變了附加到這些div的類，綁定本身仍然附着在這些相同的元素上。這基本上意味着只有您的第一個事件處理程序曾附加到任何事物上，因爲在您調用它時沒有與第二個事件處理程序匹配的任何內容。甚至在第一個事件處理程序運行並切換類之後，它仍然是一切（並且只有一個）附加到所有內容。

希望這是有道理的。

Here is a fiddle showing what you wrote and how it breaks

你需要做的是利用事件冒泡：你可以根據實際無論處理器的動態特性附上您的事件處理程序，它封裝了這些，而不是動態的元素，然後做出決定被召喚了。

這樣做的方法是使用.on()（see the documentation）

Here is a working fiddle using .on與下面的腳本：

$('.wrapper').on('click', ".entry .tog", function() { 
    $(this).closest(".entry").toggleClass("entry-active entry"); 
    $(".entry").toggleClass("entry not-active"); 

    alert("open"); 
}); 


$('.wrapper').on('click', ".entry-active .tog", function() { 
    $(this).closest(".entry-active").toggleClass("entry-active entry"); 
    $(".not-active").toggleClass("not-active entry"); 

    alert("close"); 
});

基本上我創建了一個.wrapper類，我連接到一個div保持所有條目和togs。我將事件處理程序綁定到該處理程序，其中一個綁定具有第一組類的選擇器，然後是另一個具有第二組的綁定。

我還是推薦@ Beetroot-Beetroot的答案，但希望這可以幫助你瞭解這裏發生了什麼，爲什麼它不起作用，以及如何在將來解決類似的問題。

來源

2013-01-08 22:58:59 taswyn

jQuery無法定位切換類

回答

相關問題