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无法正常工作

回答

相关问题