addClass無法正常工作

我有一個小但煩人和奇怪的問題。我有2個按鈕將一個類添加到p元素。當用戶點擊一個按鈕時，它向p元素添加類「groen」或「rood」（取決於按鈕）。然後，用戶可以用類「groen」或「rood」單擊該p元素，然後它應該執行某些操作，但它不會執行任何操作。但是，如果我在HTML中爲p元素提供類「groen」或「rood」，它將執行jQuery操作。addClass無法正常工作

我有我的項目在這裏的jsfiddle：http://jsfiddle.net/c3dfj/

如果你想看到這個問題上的點擊「JA」或「東東」複選框，並在它的「akkoord」文本檢查p元素。它顯示你「akkoord groen」或「akkoord rood」。（取決於你點擊的按鈕）。但是如果你點擊「akoord」，它什麼都不會做。我對你的類魯德/格萊恩加入到HTML，它的工作：/

<p class="akkoord"><br/>Akkoord</p>

來源

2012-12-06 Peter Boomsma

您可以發佈您的代碼？ – Adil

請發佈您的代碼 –

該項目變得相當大（我喜歡90％完成），所以發佈所有代碼在這裏不起作用。我在原帖中添加了jsFiddle。 –

當您綁定的click處理程序沒有p元素以「.rood」或「.groen」使用on代替

$('body').on('click','.rood',function() { 
     var container = $(this).parents('.container_vragen').find('.container2'); 
      container.fadeOut(400, function() { 
       container 
        .css('overflow', 'hidden') 
        .appendTo("#niet_geregeld"); 
       $(this).parents('#niet_geregeld') 
        .find('.container2') 
        .css('padding-left', '30px') 
        .fadeIn(400); 
      }); 
    }); 

    $('body').on('click','.groen',function() { 
     var container = $(this).parents('.container_vragen').find('.container2'); 
      container.fadeOut(400, function() { 
       container.css('overflow', 'hidden') 
         .appendTo("#geregeld"); 
       $(this).parents('#geregeld') 
         .find('.container2') 
         .css('padding-left', '30px') 
         .fadeIn(400); 
      }); 
    });

這種方式具有類的.rood'或」的任何元素。在按下該按鈕時分別發出'groen'將對點擊作出反應。當然，您可以將「body」選擇器精煉爲封閉的div或類似的東西，如果可能，我們會推薦它，但是在您的代碼中，您正在選擇所有'.rood'和所有'.groon'元素，以便與我保持兼容。已經使用'身體'。我也冒昧簡化代碼位，以消除不必要的選擇

來源

2012-12-06 11:39:54

謝謝，很煩人的是，當你忙一會兒時，小錯誤就會蔓延起來。好的解釋和幫助！ –

使用jQuery .hasClass（嘗試），如果它具有比類重定向到你的方法或調用該函數。否則應用函數addClass（）。

來源

2012-12-06 11:37:07 Nimmi

HTML：

<div class="parent"> 
    <button class="addgroen">addgroen</button> 
    <button class="addrood">addrood</button> 
    <p> 
    </p> 
</div>

的jQuery：

$('.addgroen').click(function(){ 
    $('p').removeClass('rood').addClass('groen'); 
}) 
$('.addrood').click(function(){ 
    $('p').removeClass('groen').addClass('rood'); 
})

jQuery的< 1.7，你應該使用：

$('.groen').live('click',function(){ 
    alert('p element with groen class clicked'); 
}); 
$('.rood').live('click',function(){ 
    alert('p element with rood class clicked'); 
});

對jquery> 1.6你應該使用：

$('.parent').on('click','.groen',function(){ 
    alert('p element with groen class clicked'); 
}); 
$('.parent').on('click','.rood',function(){ 
    alert('p element with rood class clicked'); 
});

來源

2012-12-06 11:42:51

如果要動態地添加成才你應該去jQuery的ON和OFF

Jquery ON

Jquery OFF

$(document).on('click','.rood',function() { 
//YOUR CODE 
});

來源

2012-12-06 11:47:55

addClass無法正常工作

回答

相關問題