web-dev-qa-db-ja.com

jquery e.target.hasClassが機能しない

新しいdiv（ "textbox"クラスとIDを含む）、およびその中の他の要素を動的に作成し、後のコードでそのdivをクリックイベントにバインドします。クリックされた要素を次のように表示します。

_$('#textbox_'+i).bind('click', function(event){
    alert(event.target.className);
}
_

これで問題ありません。表示されるクラスの1つとしてtextboxが表示されます。ただし、event.target.hasClass()は機能していないようです。したがって、次のことを行っても何も起こりません。

_$('#textbox_'+i).bind('click', function(event){
    if(event.target.hasClass('textbox')) { alert('got it!'); }
}
_

いくつかの異なる方法で試してみましたが、event.target.hasClass()が機能しないようです。イベントに対処する別の方法はありますか、何か間違っていますか？

jqueryeventsonclickclassname
42
user961627

標準のDOM要素でjQueryメソッドhasClass()を使用しようとしています。次のように、プレーンなJS DOM要素_e.target_をjQueryオブジェクトに変換する必要があります。

_$(event.target).hasClass('textbox')
_

そして、あなたは次のようになります：

_$('#textbox_'+i).on('click', function(event){
     if( $(event.target).hasClass('textbox')) alert('got it!');
});
_

on()の使用、click関数の適切な終了に注意してください。単純なアラートのみを実行する場合は、ifステートメントに中括弧は必要ありません。

86
adeneo

JQueryを使用せずにJS DOM要素をそのまま使用したい場合：

event.target.classList.contains('textbox')
23
iarroyo