Question

我需要进行ajax调用以检索项目列表，每个项目将成为一个HTML元素，例如<li/>，使用jQuery的.html();然后点击<li/>将触发一个包含该项目数据的函数。

问题是什么是将项目数据与<li/>相关联的更好策略。

目前我正在尝试将商品数据设为<li/>的自定义属性。

例如，我将其创建为<li myattr='itemData'>itemDisplayStr </li>。但是我无法在点击事件中获取数据，如：

$('li').click(function() {
    alert(this.myattr);
    alert(this.attr('myattr'));
    alert(this.attributes['myattr']);
});

以上都不起作用。

有人能给我一些线索吗？感谢

Answer 1

this不是jQuery object。用$() =＆gt;包围它$(this)创建jQuery对象：

$('li').click(function() {
    alert($(this).attr('myattr'));
});

docs

在处理程序中，关键字this指向处理程序绑定到的DOM元素。要在jQuery中使用该元素，可以将其传递给普通的$（）

Answer 2

你试过了吗？

alert($(this).attr('myattr'))？

Answer 3

你有没有探索jquery data？

$('li').data('foo', 52);
$('li').data('bar', { myType: 'test', count: 40 });

$('li').data('foo'); // 52
$('li').data(); // {foo: 52, bar: { myType: 'test', count: 40 }}

享受JSON的乐趣

修改如果你做了像

这样的事情，那么每个李的价值都不需要它自己的id
ul.append( $("<li>" + label + "</li>").data("foo", "bar") );

Answer 4

您忘记使用jQuery来使用attr()函数：$()。

$(this).attr('myattr');

使用HTML标记来携带自定义属性

4 个答案: