innerHTML 在 onClick 事件中将变量作为参数传递[关闭]答案

【问题标题】：innerHTML passing variables as parameters in onClick event [closed]innerHTML 在 onClick 事件中将变量作为参数传递[关闭]
【发布时间】：2016-04-08 14:22:10
【问题描述】：

我必须使用innerHTML 在onclick 事件中将变量作为参数传递。这是我的代码

var seriesdel = document.getElementById('series_name').value;
document.getElementById('all_series').innerHTML +="<p>"+document.getElementById('series_name').value+" <button class='button' id='delete' onclick='deleteseries("+seriesdel+");' value='Delete'>Delete</button></p>";

如您所见，我尝试在函数“deleteseries”中传递变量“seriesdel”，但无法使其正常工作。

感谢您的帮助。

【问题讨论】：

查看生成的代码。

标签： javascript html innerhtml

【解决方案1】：

表单控件的值是字符串。

当你想在 JavaScript 中粘贴一个字符串值时，你必须用引号括起来。

您省略了引号，因此输入中的任何内容（除非是数字）都将被视为变量名或语法错误。

添加引号。

试图处理嵌入在 HTML 中的 JavaScript 嵌入在 JavaScript 中（很可能是嵌入在 HTML 中）会让你头疼。改用 DOM。它更冗长，但更清晰。

var seriesdel = document.getElementById('series_name').value;
var paragraph = document.createElement('p');
paragraph.appendChild(document.createTextNode(seriesdel));
var button = document.createElement("button");
button.classList.add("button");
button.setAttribute("id", "delete");
button.value = "Delete";
button.appendChild(document.createTextNode("Delete"));
button.addEventListener("click", deleteHandler);
paragraph.appendChild(button);
document.getElementById('all_series').appendChild(paragraph);

function deleteHandler(event) {
    deleteseries(seriesdel);
}

【讨论】：

【解决方案2】：

由于您试图传递一个字符串对象，您需要在 onclick 函数调用中转义您的字符串： onclick='deleteseries(\""+seriesdel+"\");'

【讨论】：

谢谢！现在完美运行！