javascript - 内联 javascript 函数调用 - 元素列表后缺少 ]

Question

我有一个代码:

var data = $('<span onclick="someFunction(' + element + ');"><a href="#">Element information</a></span>');

其中元素是一个对象。

此外，我还定义了一个函数:

someFunction: function(element) {
   console.log(element);
   .... // some code
}

但是当 span 元素尝试调用该函数时，出现错误:

SyntaxError: missing ] after element list 
someFunction([object Object]);

当我在 Firebug 中调试它时，我看到了

<span onclick="someFunction([object Object]);">
   <a href="#">Element information</a>
</span>

我通常如何使用具体元素作为参数来调用该函数？

Answer 1

您将无法传递该元素，因为它在您的连接中被转换为字符串。当一个对象被转换为字符串时，它输出:[Object object]。这就是您在调试中看到的。

我的建议:您可以将元素作为数据添加到跨度中，例如:

$('span).data('element', element);

然后在 someFunction 中像这样检索它:

var element = $(this).data('element');

另一种选择是在初始化元素的位置绑定(bind)到 Javascript 中的单击。像这样

function anotherFunction() {
  var element = {};

  // Initialize element
  ...

  // I have already got the element initialized, now I can bind the click
  $('span').click(function() {
    // For your debug and validation
    console.log(JSON.stringify(element));
  });
}