クリックされたdivのIDを取得する

現在のdivのjQueryをクリックすると、そのdivの id を選択します。
たとえば、次のようなHTMLがあるとします。

<div class="item"  id="10">hello world</div>
<div class="item_10">hello people</div>

.item クラスの最初のdivをクリックすると、現在のdiv +の id
を数字（10）にコピーして、 （ "div id" + 10）は2番目のdevクラス=
item_10と同じです。

私は currentid = this.id; を使用しようとしましたが、動かない:(！

ベストアンサー

First, note that id attributes starting with
numbers are syntactically illegal in HTML4. If you’re using
id="10" make sure that you’re using the HTML5 doctype
(<!DOCTYPE HTML>).

実際のコードを見ることなく、あなたがしていたことがうまくいかなかった理由を言うのは難しいです。恐らくそれは上位の要素（本文のような）にイベントを登録していたためで、
this.id はその上位要素の id でした。に。

この場合、イベントの target
プロパティを使用して、クリックした内容を探したいとします。例えば：

$(document.body).click(function(evt){
  var clicked = evt.target;
  var currentID = clicked.id || "No ID!";
  $(clicked).html(currentID);
})

Seen in action: http://jsfiddle.net/Gra2P/

代わりに特定の要素に登録していた場合は、 this.id が機能します：

$('div').click(function(evt){
  var currentID = this.id || "No ID!";
  $(this).html(currentID);
})

Seen in action: http://jsfiddle.net/Gra2P/1/

しかし、以下の理由から、これはあまり理想的ではありません。

1ではなく多くのイベントハンドラ登録を行い、
このコードの実行後に追加のdivがドキュメントに追加された場合、ドキュメントは処理されません。

jQuery 1.7では、 .on
メソッドを使用して、イベントをキャッチする要素の種類のセレクタを持つ親要素に単一のイベントハンドラを作成し、 this < code>を設定します。コード内：

$(document.body).on('click','div',function(evt){
  var currentID = this.id || "No ID!";
  $(this).html(currentID);
})

Seen in action: http://jsfiddle.net/Gra2P/2/

コメントする 返信をキャンセル

コメントする返信をキャンセル