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

我需要做一个ajax调用来检索项目列表，每个项目将通过使用jQuery的.html();成为一个HTML元素，例如<li/>然后点击<li/>将触发一个函数有关该项目的数据。使用HTML标签来携带自定义属性

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

当前我正在尝试将项目数据定制为属性<li/>。

例如我将它创建为<li myattr='itemData'>itemDisplayStr </li>。但是我无法在点击事件中找回数据，如下所示：

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

以上都不是。

任何人都可以给我一些线索吗？谢谢

来源

2012-02-23 Michael Chen

您正在调用'this.attr（'myattr'）'，但表示您将其设置为'itemDisplayStr'。我假设这只是很快写入示例代码？尝试'$（this）.attr（'itemDisplayStr）;' – MetalFrog 2012-02-23 16:01:20

@MetalFrog。是的，他需要'$（this）'查看我添加到我的答案中的文档。 – gdoron 2012-02-23 16:07:03

this不是jQuery object。与$() =>$(this)包围它创建jQuery对象：

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

文档

在处理程序中，这指的是DOM元素的关键字，其处理程序的约束。要使用jQuery中的元素，它可以传递到正常$（）

来源

2012-02-23 16:01:21 gdoron

你试过：

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

来源

2012-02-23 16:01:30

感谢您的快速解答。解决方案就这么简单。 – 2012-02-23 16:21:12

你探索了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

编辑什么，如果你不喜欢的东西

ul.append($("<li>" + label + "</li>").data("foo", "bar"));

来源

2012-02-23 16:03:26

不知道.data（）。我会记住将来使用它。但是对于这个我需要单独使用每个lt />，如果使用.data（），我可能需要为每个项目动态创建一个id。 – 2012-02-23 16:28:18

看到我的编辑... – 2012-02-23 17:02:46

你忘了使用jQuery使用它的价值每李难道不需要自己的ID attr()功能：$()。

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

来源

2012-02-23 16:03:49 rcdmk

感谢您的快速解答。解决方案就这么简单。 – 2012-02-23 16:21:01

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

回答

相关问题