javascript - 单击后定义 'this'

Question

我有一堆 ajax 函数，我正在触发事件(点击、dblclick、按键等)在我的 events.js 文件的开头，我想定义一个变量，它代表用户点击的元素的 ID。目前是

$(this).parents('li').attr('data-id')

到目前为止，我尝试过这种方式:

var element_id = $(this).parents('li').attr('data-id');

var test = function(id)
{
    ajaxCall(id);
}

$('.js_btn_test').live('click', function()
{
    test(element_id);
}

不幸的是，它不起作用。我认为当我单击 .js_btn_test 时会解析 element_id var 并将其评估为其父“li”，然后获取数据 ID。

感谢您的帮助!

EDIT1:基本的 HTML 结构

看起来像这样

<li data-id="<?php echo $item->getId(); ?>">
    <button class="js_btn_test">Test</button>
</li>

Answer 1

不，它不是那样工作的。与...

var element_id = $(this).parents('li').attr('data-id');

...您为 element_id 变量立即分配一个值，而不取决于您接下来检查它的值时 this 是什么时间。

一种可能的解决方法是改用函数:

var getElementId = function(el) {
  return $(el).parents('li').attr('data-id');
};
...
$('.js_btn_test').live('click', function() {
   test(getElementId(this));
});

... 作为事件处理程序中的 this(您传递给 live 的匿名函数)引用触发事件的元素。

作为旁注，您可以将 .attr('data-id') 换成 .data('id') 调用，如图所示 here并描述了here .