クラス「foo」を削除できないようで、その理由がわかりません。ユーザーが.fooをクリックすると、jQueryは.fooを削除すると想定されます。一見すると、テキストが赤くなくなったので機能しているように見えます。ただし、.fooを数回クリックすると、アラートボックスが表示されるため、.fooが完全に削除されていないことを意味します。なぜこれが起こっているのか分かりません。
jQuery：
$(document).ready(function() {
$('.foo').click(function() {
$(this).removeClass('foo');
alert('Class .foo should have been removed. Why is this alert still appearing?');
});
});
html：
<p class="foo">foo</p>
css：
.foo { color: red; }
クリックリスナーのバインドを解除する必要があります。
$(document).ready(function() {
$('.foo').click(function() {
$(this).removeClass('foo');
alert( 'Class .foo should have been removed. Why is this alert still appearing?' );
$(this).unbind('click');
});
});
on（）を使用すると、イベントは「.foo」ではなく本体にバインドされるため、クリックごとにセレクターが実際に評価されます。
$(document).ready(function() {
$("body").on("click", ".foo",function() {
$(this).removeClass('foo');
alert( 'Class .foo should have been removed. Why is this alert still appearing?' );
});
});
を実行すると、その時点$('.foo')で持っている要素の静的セットを取得します。したがって、後でそれらの要素から取得した場合でも、リスナーをその元の要素のセットにバインドします。class="foo" removeClass('foo')
.onその動作を変更したい場合は、またはを検討して.delegateください。
それはうまく機能しています、リスナーはまだバインドされています。http://jsfiddle.net/Nvrp8/5/