0

我没有使用 Click 事件，而是使用 .on 进行此操作。但是当我单击 deleteArticle 按钮时，我想获得第一个 td html。我将如何使用 jquery this 或其他东西来选择它

$("#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最接近的单击按钮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

上述说法是不正确的。

如果您看到文档

事件只需要冒泡一个级别（从点击的 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 定义的某个值（创建函数的第一个参数，第二个...）。

当您想要获取整个表以便可以迭代每个 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 回答