のIDる要素の火力発イベント

StackOverflow https://stackoverflow.com/questions/48239

  •  09-06-2019
  •  | 
  •  

質問

必要があります。IDを取得しまする要素の火災イベント?

私は考えるようなもの:

<html>
  <head>
    <script type="text/javascript" src="starterkit/jquery.js"></script>
    <script type="text/javascript">
      $(document).ready(function () {
        $("a").click(function () {
          var test = caller.id;
          alert(test.val());
        });
      });
    </script>
  </head>
  <body>
    <form class="item" id="aaa">
      <input class="title"></input>
    </form>
    <form class="item" id="bbb">
      <input class="title"></input>
    </form>
  </body>

</html>

以外のコースは、var test が含まれる必要があるid "aaa", の場合、イベントがトリガから、 "bbb", の場合、イベントがトリガからです。

役に立ちましたか？

解決

マウスでクリック event.target 常に参照するようにする要素にはイベントをトリガしたが、 event のパラメータに渡されます。 http://api.jquery.com/category/events/event-object/

$(document).ready(function() {
    $("a").click(function(event) {
        alert(event.target.id);
    });
});

ることにも注意 this もたらすものではありませんのでjQueryオブジェクトで利用を希望する場合は、jQueryの機能として参照しなければなりません。で $(this), 例えば:

$(document).ready(function() {
    $("a").click(function(event) {
        // this.append wouldn't work
        $(this).append(" Clicked");
    });
});

他のヒント

参考までに、この記事の評価欄へ本当にうまくいきます。

jQuery("classNameofDiv").click(function() {
    var contentPanelId = jQuery(this).attr("id");
    alert(contentPanelId);
});

でもパンフレット等に記載したその他の投稿したかったこのスペル：

$(event.target).id は定義されていません

$(event.target)[0].id のid属性。

event.target.id インターネット上のid属性。

this.id のid属性。

や

$(this).id ついては、定義されていません。

の違いはもちろん、jQuery物DOMオブジェクト。"id"は、DOMできとして認識されるものになるので、DOM要素オブジェクトを使用します。

（逆くのでしょう逆人)

すべてのイベントは制限させていただくことになjQueryを利用でき

var target = event.target || event.srcElement;
var id = target.id

場所 event.target 失敗し、その後 event.srcElement のために打ち出されている。-の明確化上記のコードを必要としないjQueryも作品とjQuery.

利用できる (this) 参照オブジェクトを発射します。

'this' は DOM 要素場内のコールバック関数(このjQuery）は、例えば、呼び出しをクリックし、それぞれに結合する。ます。

こちらは学ぶことができます: http://remysharp.com/2007/04/12/jquerys-this-demystified/

私を動的にテーブル、データベースのデータをJSONで表示します。各テーブルが行った独自の ID, また、更なる行動があれば、DOMは変更が必要になり異なるアプローチ:

$("table").delegate("tr", "click", function() {
   var id=$(this).attr('id');
   alert("ID:"+id);  
});

要素燃焼イベントとして イベント 財産

event.currentTarget

ま DOMノード オブジェクトに設定したイベントハンドラです。

もの子ノードを開始したバブリング処理して

event.target

イベントオブジェクトは常に最初の属性のイベントハンドラの例:

document.querySelector("someSelector").addEventListener(function(event){

 console.log(event.target);
 console.log(event.currentTarget);

});

についての詳イベントの委譲した読み取りが可能で http://maciejsikora.com/standard-events-vs-event-delegation/

ソース要素として、jQueryオブジェクトを得なければならないと思いますよ

var $el = $(event.target);

この新しくできたの源泉をクリックではなく、素子のクリック機能を割り当てます。で行うことができ、クリックイベントは、親オブジェクト 例えば.クリックイベントテーブルの行は、必要な細胞をクリックされた

$("tr").click(function(event){
    var $td = $(event.target);
});

滞在ビザを取得することができ用

$('*').live('click', function() {
 console.log(this.id);
 return false;
});

の場合は委任事務のイベントハンドラがいて思ったこと。

<ul>
    <li data-id="1">
        <span>Item 1</span>
    </li>
    <li data-id="2">
        <span>Item 2</span>
    </li>
    <li data-id="3">
        <span>Item 3</span>
    </li>
    <li data-id="4">
        <span>Item 4</span>
    </li>
    <li data-id="5">
        <span>Item 5</span>
    </li>
</ul>

おJSのコードはこのように:

$(document).ready(function() {
    $('ul').on('click li', function(event) {
        var $target = $(event.target),
            itemId = $target.data('id');

        //do something with itemId
    });
});

んによるものを見つけることがitemIdは undefined, 内容としてのLIに包まれ <span>, というの <span> を交えながら、それらのイベント。ときのこの小さなチェックはこのように:

$(document).ready(function() {
    $('ul').on('click li', function(event) {
        var $target = $(event.target).is('li') ? $(event.target) : $(event.target).closest('li'),
            itemId = $target.data('id');

        //do something with itemId
    });
});

または、希望の場合は最大限の可読性(また不必要な繰り返しのjQuery包装着):

$(document).ready(function() {
    $('ul').on('click li', function(event) {
        var $target = $(event.target),
            itemId;

        $target = $target.is('li') ? $target : $target.closest('li');
        itemId = $target.data('id');

        //do something with itemId
    });
});

使用時のイベントが代表団は、 .is() 方法はかけがえのない財産しているかどうかを確認するイベント目標などは実際に必要なものです。使用 .closest(selector) 検索のDOMツリー用 .find(selector) 一般的には相 .first(), して、 .find(selector).first())を検索します。必要な利用 .first() 利用の場合 .closest(), としてのみが返されます最初のマッチング上位の要素が .find() すべてのマッチングの子孫に当たります。

利用できます。イベント

  $("table").on("tr", "click", function() {
                    var id=$(this).attr('id');
                    alert("ID:"+id);  
                });

var buttons = document.getElementsByTagName('button');
var buttonsLength = buttons.length;
for (var i = 0; i < buttonsLength; i++){
    buttons[i].addEventListener('click', clickResponse, false);
};
function clickResponse(){
    // do something based on button selection here...
    alert(this.id);
}

ワJSFiddle こちらの.

この作品より高い z-index のイベントパラメータ記述回答:

$("#mydiv li").click(function(){

    ClickedElement = this.id;
    alert(ClickedElement);
});

このように得に探しましょに id （この例では li)要素になります。またクリックすると、子要素親会社の..

this.element.attr("id") 動作にIE8.

いずれも、

jQuery(this).attr("id");

や 

alert(this.id);

いただけます。 this 参考

$(this).attr("id")

または

$(this).prop("id")

できる機能を利用するには、idを取得し、価値の変更（私の例では、私を使用を選択します。

              $('select').change(
                   function() {
                        var val = this.value;
                        var id = jQuery(this).attr("id");
                        console.log("value changed" + String(val)+String(id));
                   }
               );

ここでは、ほとんどの種類の要素

$('selector').on('click',function(e){
    log(event.currentTarget.id);
    });

私協働

jQueryのオートコンプリート

また、 event 上記のものが要求機能の火災に見られるとは思えません。使用した this.element.attr("id") の要素のIDではなく、そうで。

の場合は角度7.xを得ることができネイティブ素子とそのid。

myClickHandler($event) {
    this.selectedElement = <Element>$event.target;
    console.log(this.selectedElement.id)
    this.selectedElement.classList.remove('some-class');
}

html:

<div class="list-item" (click)="myClickHandler($event)">...</div>
ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top