javascript - 使用javascript修改html元素并创建新元素

Question

我有下面一段代码

<input type="text" />
<button> Submit </button>

现在，当用户键入一些输入并单击提交按钮时，我希望输入文本变得不可编辑，但文本应该仍然存在。此外，提交按钮应该消失。此外，在输入文本框下方，我想创建另一个与带有提交按钮的原始文本相似的输入文本。所以，这有点像评论系统。关于如何使用 javascript 执行此操作的任何想法。

Answer 1

下面是一个非常简单的方法。但是，对于不显眼的 Javascript，您应该以编程方式将 onclick 事件绑定(bind)到按钮。或者更好的是，使用 jQuery，它总是抽象事件，这就是我们如此喜欢它的原因。

 <script>
 function disableInput() {
  document.getElementById("foo").disabled = true;
  document.getElementById("bar").style.display = "none";
 }
 </script>

<input id="foo" type="text" value="Some Text" />
<button id="bar" onclick="disableInput();"> Submit </button>