2

我有一个代码:

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>

我通常如何以具体元素作为参数调用该函数?

4

3 回答 3

4

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

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

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

并在 someFunction 中像这样检索它:

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

另一种选择是在初始化元素的位置绑定到单击 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));
  });
}
于 2012-12-12T06:51:54.527 回答
1

如果你尝试用 jQuery 构建一些 DOM 元素,你应该这样做:

// Wrong: $('<span onclick="someFunction(' + element + ');"><a href="#">Element information</a></span>');
// Right: build up the element step by step
var data = $('<span/>')
           .append(
               // build up the child <a> element here
               $('<a href="#"/>')
               .text("Element information")
               //.attr('href',"#") Don't really need this
           )
           .click(
               // Here is a real inline function
               function(){
                   someFunction(element);
               }
           );

注意:.click在 jQuery 中可用于为 Click 事件分配事件处理程序。


在您的原始代码中,您尝试将字符串与对象连接起来,这将导致应用于toString该对象,将其转换为字符串:

console.log((new Object()).toString()); // [object Object]
console.log("blah" + (new Object())); // blah[object Object]

在您的代码中,您的对象似乎实际上是一个 jQuery 对象,但它不会产生任何差异。

所以用来形成的“代码”onclick无效的:

someFunction([object Object]);

[并且]用于在 JavaScript 中构造一个数组,就像[1, 2]一个包含两个元素的数组一样。但是[object Object],这是一个无效的 JavaScript 语法,因此您会收到错误消息。

无论如何,这不是使用事件构建 DOM 元素的正确方法,即使使用 jQuery 也是如此。上面显示了正确的方法。

于 2012-12-12T07:05:41.247 回答
0

你也可以试试:

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

功能:

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

调用时应返回 JSON 对象。

于 2016-06-29T04:11:42.213 回答