从生成的HTML向JavaScript函数传递参数

我有一个AJAX程序，可以从网站获取数据，并将信息发布到Facebook。我的问题很简单。我需要在回调函数中生成HTML。这里有一个按钮：

var city = "Beijing";
html+= "<td><input type=button value=FACEBOOK onclick=\"fb("+city+")\"></td>";
document.getElementById("myDiv").innerHTML = html;

var city=“北京”；
html+=“”；
document.getElementById（“myDiv”）.innerHTML=html；

假设我有变量“city”，它有一定的值。通过生成上述按钮，我无法将城市传递给函数fb（城市）。它甚至不会调用该函数。但是，如果我删除该参数，它就会工作。

var city=“Beijing”；
var city = "Beijing";
html+= "<td><input type=button value=FACEBOOK onclick=\"fb('"+city+"')\"></td>";
document.getElementById("myDiv").innerHTML = html;

html+=“”；
document.getElementById（“myDiv”）.innerHTML=html；

您忘记了单引号：）

不是fb（“+city+”），而是产生fb（北京）

---

但是fb（“+city+”）比fb（'Beijing'）更能产生fb。

字符串中的字符串技术最终会被你淘汰。更好的方法是使用onclick属性指定单击事件：

var city = "Beijing";
var td = document.createElement("td");
var input = document.createElement("input");
input.setAttribute("type","button");
input.setAttribute("value","FACEBOOK");
input.onclick = function() {
    fb(city);
};

td.appendChild(input);
document.getElementById("myDiv").appendChild(td);

这不仅消除了字符串中字符串的不可读性，还确保了添加到#myDiv元素的DOM节点将被DOM中的JavaScript识别。某些浏览器在通过编程识别使用innerHTML添加的DOM元素时遇到问题。我在Firefox和基于XUL的浏览器中体验过这种行为

---

另一方面，jQuery可以更顺畅地执行此操作，并保证跨浏览器兼容性，但这是

jQuery

标记的问题。

当处理函数时，由于城市将替换为“北京”，html片段将生成如下所示：

<td><input type=button value=FACEBOOK onclick="fb(Beijing)"></td>

正如你在这里所看到的，北京周围没有一个“”符号。因此，它将被视为一个变量，实际上并不存在

最简单的修复方法可能是：

html+= "<td><input type=button value=FACEBOOK onclick=\"fb('" + city + "')\"></td>";

html+=”；

---

实际上，还有很多其他更好的方法来实现你的目标。您应该从javascript代码绑定“click”事件，而不是将其内联添加到html中。通过从javascript函数绑定它，实际上您可以将值嵌入到闭包中。

Ming，您有闭包的示例吗？我认为这可能值得记录。然后op可以决定使用哪种技术。：）+我认为这是一个很好的建议。当您将JavaScript与HTML分开，将HTML与JavaScript分开时，结果是代码更易于维护。