我有以下例子:
<div class="filtrer">
<a class="bold">Url 1</a>
<a>Url 2</a>
</div>
第一个 url 处于事件状态,第二个处于非事件状态,粗体表示已选中。我应该只被允许按 Url 2,一旦我这样做,粗体类应该切换到 Url 2。
我已经尝试过但没有成功的是:
$('.filtrer a').filter(':not(.bold)').on('click', function(){
var current = $('.filtrer a').filter(':not(.bold)');
var standby = $('.filtrer a.bold');
current.addClass('bold');
standby.removeClass('bold');
})
有人知道为什么这不起作用吗?或者有优化的解决方案?谢谢
最佳答案
您正在处理动态元素选择器,因此您需要使用基于委托(delegate)的事件处理程序
var $as = $('.filter a');
$('.filter').on('click', 'a:not(.bold)', function () {
var current = $as.filter(':not(.bold)');
var standby = $as.filter('.bold');
current.addClass('bold');
standby.removeClass('bold');
})
演示:Fiddle
可以写成
var $as = $('.filter a');
$('.filter').on('click', 'a:not(.bold)', function () {
$as.toggleClass('bold');
})
演示:Fiddle
关于javascript - 点击事件的jquery开关类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19982227/