javascript - 添加带有 innerHTML 属性的按钮

Question

我正在尝试在 <span id="options"></span> 中添加 html 代码所以我正在尝试使用它:

function editTextArea(element) {
   var options = document.getElementById("options");
   options.innerHTML = options.innerHTML + "Cols: <input type='text' id='colsTextArea' maxlength='3' /><br>Rows: <input type='text' id='rowsTextArea' maxlength='2' /><br><button type='button' onclick='updateTextArea('" + element.id + "')' >Add</button><br>";
}

但这是我得到的，

<button type="button" onclick="updateTextArea(" textarea0')'="">Agregar</button>

我的问题是引号，所以我后来尝试使用 createElement("button")，但现在我无法添加 onclick 属性。

我没有使用 jQuery，所以没有它的解决方案会很好。

Answer 1

对于 updateTextArea 的函数调用，您需要使用不同于 onclick 属性的引号。不能执行 onclick='alert('hi');'，因为单引号终止了 onclick 属性。

function editTextArea(element) {
   var options = document.getElementById("options");
   options.innerHTML = options.innerHTML + "Cols: <input type='text' id='colsTextArea' maxlength='3' /><br>Rows: <input type='text' id='rowsTextArea' maxlength='2' /><br><button type='button' onclick='updateTextArea(" + '"' + + element.id + '"' + ")' >Add</button><br>";
}

您至少应该考虑通过适当的 DOM API 调用来执行此操作。你试试 document.createElement 是对的

要设置一个点击，做这样的事情:

var button = document.createElement('button').
button.onclick = function(){
 alert('I was clicked');
}