1

我正在使用 jQuery.ajax 读取 XML 文件并将其呈现为 HTML。

下面的代码为 XML 中的每个数据记录生成一个按钮表：

$(xml).children('run').each(function() {
    var runname = $(this).children('name').text();

    buttonHtml = '<tr><td class="expbutton" id="runExpButton" onmousedown="myFunc(runname)">Click me</td></tr>';

    $('#Runs').append(buttonHtml);
});​

不难看出我想在这里实现什么。但显然它不起作用。

我的问题是如何在 jQuery 中实现这一点？如果我使用 .live 或 .on 方法，我将无法访问局部变量，例如“runname”。

[编辑]

尝试使用 jQuery.data()：

$(xml).children('run').each(function() {
    var runname = $(this).children('name').text();

    buttonHtml = '<tr><td class="expbutton" id="runExpButton" onmousedown="myFunc(runname)">Click me</td></tr>';
    $('#runExpButton').data('runname', runname);
    $('#Runs').append(buttonHtml);
});​

$('#runExpButton').live('click',function() {
    alert($(this).data("runname"));
});

它似乎不起作用？只有一个按钮具有正确的数据值。

因为所有按钮都有相同的 id，我怀疑 .data() 不适用于这个？

4

2 回答 2

2

我相信你正在寻找的是 jQuery .data()

您可以存储 html 元素的数据，然后在单击该元素时拉入该数据。

一个例子是

$(xml).children('run').each(function(index) {
    var runname = $(this).children('name').text();
    buttonHtml = '<tr><td class="expbutton" id="runExpButton'+index+'">Click me</td></tr>';
    $('#Runs').append(buttonHtml);
    $('#runExpButton'+index).data('runname', runname);
});​

$(document).on('click', '.expbutton', function(){
     alert($(this).data('runname'));
});

我编辑了您的代码，为您要添加到表中的每个单元格添加唯一 ID。

于 2012-12-21T04:12:41.123 回答
0

您可以将 HTML 更改为类似

buttonHtml = '<tr><td class="expbutton" id="runExpButton" data-name="' + runname + '">Click me</td></tr>';

然后，正如 Blake 正确指出的那样，使用 $(element).data('name') 来获取该值。因此，将事件与 .live 绑定，读取数据名称，获利！

于 2012-12-21T04:25:42.663 回答