javascript - index.html :1 Uncaught ReferenceError: VARIABLE is not defined at HTMLDivElement. onclick

Question

我正在尝试将包含 HTML 标记的 jquery 选择器中的 HTML 文件中的变量传递给 JavaScript 函数。

var $tweeter = $('<div class="tweeter" onClick="userTweet(' + streams.home[index].user + ')"></div>');

其中 userTweet() 是我链接的 JavaScript 文件中的一个函数，streams.home[index].user 是一个包含 user< 的用户对象数组、message 和 created_at 键。当我点击 div 时，出现错误

index.html:1 Uncaught ReferenceError: VARIABLE is not defined at HTMLDivElement.onclick

VARIABLE 是 streams.home[index] 的 user 属性中的用户名

如何传递这个变量来运行我的 JavaScript 文件中的函数？如果您需要任何进一步的信息，请告诉我。

谢谢!

Answer 1

你是这里单引号 (') 和双引号 (") 的受害者。

当你尝试做的时候

var $tweeter = $('<div class="tweeter" onClick="userTweet(' + streams.home[index].user + ')"></div>');

// For Simplicity assuming streams.home[index].user value is 'mike'

您的字符串不是您所期望的。

这是形成的字符串:

<div class="tweeter" onClick="userTweet(mike)"></div>
// Note mike is not a value but as a variable here

这是你所期望的:

<div class="tweeter" onClick="userTweet('mike')"></div>
// Note 'mike' is value here

因此，当您调用 userTweet 时，您传递了一个不存在的变量 mike 并出现此错误。

这两个调用的区别在于 userTweet(mike) 和 userTweet('mike')。在第一次调用时，mike 是变量(你的情况)，在第二次调用时它是一个值。

会推荐你关注this link over string and backticks in javascript因为这为您的问题提供了解决方案。

也只是这样做

var $tweeter = $(`<div class="tweeter" onClick="userTweet(' ${streams.home[index].user} ')"></div>`);

// If on older version and new JavaScript is not supported then
var $tweeter = $('<div class="tweeter" onClick="userTweet(' + "'" + streams.home[index].user + "'" + ')"></div>');