innerHTML在onClick事件中传递变量作为参数

Question

我必须在使用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>"; 

正如你看到的，我尝试通过变量“seriesdel”在函数“deleteseries”但我不能让它工作。

感谢您的帮助。

Answer 1

既然你试图传递一个字符串对象，你需要逃避你的字符串在onclick函数调用： onclick='deleteseries(\""+seriesdel+"\");'

Answer 2

表单控制值是字符串。

当你想在JavaScript中保留一个字符串值时，你必须用引号把它括起来。

您已经省略了引号，因此无论输入到输入中（除非它是数字），都将被视为变量名称或语法错误。

添加引号。

---

试图处理嵌入在JavaScript中的JavaScript（可能嵌入在HTML中）中嵌入的JavaScript会让您头疼。改用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); 
}