0

Clickイベントを使用する代わりに、これに.onを使用しています.でも、deleteArticleボタンをクリックしたときに最初のtd htmlを取得したい.jquery thisまたは何かを使用して選択するにはどうすればよいですか

$("#pard_admin").on("click", ".deleteArticle", function (event) {
    var data = $(this).closest('tr').find('td:first').html();
});

上記では、これは.deleteArticleではなく#pard_adminに関連しています

$(".deleteArticle").click(function (event) {
    var data = $(this).closest('tr').find('td:first').html();
});

ここでは、これはに関連して.deleteArticleいます。この選択を使用して、クリックするだけの.deleteArticleボタンを最も近くにするにはどうすればよいtr td first innetHHTMlですか?

ここに画像の説明を入力

4

3 に答える 3

1

どちらの場合も、クリックするthisと同じ要素を参照します.deleteArticle.deleteArticle

于 2013-06-15T10:20:46.657 に答える
0 
in above this is relevant to the #pard_admin not for .deleteArticle i guess

上記のステートメントは正しくありません。

ドキュメントを見たら

イベントは 1 レベル (クリックされた tr から tbody まで) バブルアップするだけで済みます。

それ.deleteArticleで選ばれる。

$(this) は event.target から jQuery オブジェクトを作成しています。

于 2013-06-15T10:24:03.863 に答える
0

jquery を使用せずに、そのようにイベント リスナー関数を定義できます。

var firstTd = document.getElementById('firstTd');

// or 

var firstTd = document.getElementsByClassName('firstTd')[0];

var eventHandler = function(td){
   console.log('firstTd: ',td);
}.bind(null,firstTd); // firstTd is the value for the first param

document.getElementsByClassName('deleteArticle')[0].addEventListener('click',eventHandler);

コードが行うことは、bind を使用して関数を作成することです。作成された関数のパラメーターの値を定義できます。

var createdFunction = function(){}.bind(/* param for this */, /* first param for the created function */, /* second...*/)

createdFunction が呼び出されると、bind で定義した特定の値にアクセスできます (作成された関数の最初のパラメーター、2 番目のパラメーター)。

各 td 要素を反復できるようにテーブル全体を取得する場合は、次の方法でこれを行うことができます。

 var firstTd = document.getElementById('firstTd');
 var eventHandler = function(td){

    console.log('table: ',this);
    console.log('table-children: ',this.children);
    var tableChildren = Array.prototype.slice.call(this.children); // casts htmlCollection to Array
    // now you can iterate over each td-element and use the Array-Methods (slice, split, reverse..)

 }.bind(document.getElementsByClassName('mytable')[0]); // sets html-table-element as

 document.getElementsByClassName('mytable')[0].addEventListener('click',eventHandler);

これがお役に立てば幸いです。

于 2013-06-15T10:50:16.690 に答える