如何使用jquery这个

Question

而不是使用Click事件我正在使用.on为此。但是当我点击deleteArticle按钮时我想获得第一个td html。我会选择使用jquery这个或者什么

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

在上面这与#pard_admin无关。不是.deleteArticle我猜

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

在这里，这与.deleteArticle相关。那么我如何使用此选择来获得最接近.deleteArticle的{​​{1}}按钮？

Answer 1

在您的两种情况下，this如果您点击.deleteArticle

，则会引用相同的元素.deleteArticle

Answer 2

in above this is relevant to the #pard_admin not for .deleteArticle i guess

以上陈述不正确。

If you see docs

  

事件只需要冒出一个级别（从点击的tr到tbody）：

因此.deleteArticle被选中。

$（this）从event.target创建jQuery对象。

Answer 3

您可以在没有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定义的某个值（创建函数的第一个参数，第二个......）。

当你想获得整个表格以便你可以迭代每个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);

我希望这会对你有所帮助。