我有一些javascript / jquery代码,用一堆列表项动态填充无序列表。在列表项中,我有一个链接,我想将一些数据与生成的链接相关联:
var thing1 = { name: 'My Object' };
var thing2 = { name: 'My Other Object' };
var li = $('<li></li><br />');
var aSel = $('<strong>' + thing1.name + '<br /><a class="btn btn-mini btn-success addDeal" href="javascript:void(0)"><i class="icon-plus"></i>Add Deal</a>';
li.append(aSel);
li.append(add);
$('#sidebar').append(li);
//This is in a loop so the same thing would happen with thing2, etc
会像这样生成HTML:
<div id="results">
<ul id="sidebar">
<li>
<strong>My Object</strong><br />
<a class="btn btn-mini btn-success addDeal" href="javascript:void(0)"><i class="icon-plus"></i>Add Deal</a>
</li>
<li>
<strong>My Other Object</strong><br />
<a class="btn btn-mini btn-success addDeal" href="javascript:void(0)"><i class="icon-plus"></i>Add Deal</a>
</li>
</ul>
</div>
因此,如果用户点击第一个“添加交易”链接,我希望在我的脚本中的其他位置使用thing1
数据。如果点击了第二个链接,我想使用thing2
数据。
我要走的路径涉及一个数组和一些对我来说不太合适的代码。我想我错过了一些微不足道的事情。
答案 0 :(得分:2)
您可以使用jQuery.data功能将“内容”附加到每个链接。在var aSel =
行之后:
$('a', aSel).data('thing', thing1); // Select the anchor tag inside of
// aSel and attach thing1 to it
然后,当点击锚标记时,使用:var thing = $(this).data('thing');
答案 1 :(得分:1)
您可以使用HTML5 Custom Data Attributes (data-*)来实现您的目标。
特别注意使用JavaScript使用数据属性。