3

我正在尝试将对象传递给 onclick 事件中的函数。如果我运行下面的代码，我会得到Uncaught SyntaxError: Unexpected indentifier. 如果我取消注释该JSON.stringify行，并使用taskAsJson代替task，我会得到同样的错误。

$.each(tasks, function (index, task) {
    //var taskAsJson = JSON.stringify(task);
    items.push('<li><a href="#" onclick="showTask(' + task + ');">' + task.Description + '</a></li>');
});

但是，如果我硬编码一个值，比如 5，它会起作用，并且 5 会传递给函数。

$.each(tasks, function (index, task) {
    items.push('<li><a href="#" onclick="showTask(' + 5 + ');">' + task.Description + '</a></li>');
});

当我尝试传递我的对象时，为什么会出现该错误？我需要改变什么才能通过task或taskAsJson？

注意：items 是一个用于更新 div 和 listview 的数组：

$('#appTasks').append(items).listview('refresh');
4

2 回答 2

7

HTML 中的 JavaScript 很糟糕。JavaScript 中的 HTML 很糟糕。JavaScript 中的 HTML 中的 JavaScript？你会遇到这样的问题。

以正确的方式制作元素。

var items = $.map(tasks, function(task) {
    return $('<li>').append(
        $('<a>', {
            href: '#',
            text: task.Description,
            click: function(e) {
                e.preventDefault();
                showTask(task);
            }
        })
    );
});
于 2013-09-29T21:42:27.753 回答
3

问题在于showTask(' + task + ');JavaScript 代码中缺少引号。例如，如果task是“汽车”，则创建的 HTML 将是onclick="showTask(cars)". 现在“汽车”缺少引号。此外，在您的示例中task可能甚至不是字符串而是对象，因此您正在寻找类似task.id获取正确参数的东西。否则task的字符串表示将是[object Object].

它在您硬编码 5 时起作用，因为 5 是一个不需要引号的数字值。（onclick="showTask(5)"有效）

因此，如果您将其更改为showTask(\'' + task + '\');它应该可以工作，因为转义的 \' 将是 ' 在最终的 HTML 代码中导致onclick="showTask('valueOfTask')"（至少如果task参数中是您想要的字符串）。但是，正如 minitech 所指出的，将 JS 代码放在 HTML 中通常是不好的。

于 2013-09-29T22:17:59.660 回答