javascript - 将输入值获取到 <form> 内联中

Question

按照我的代码:

<script>
function getText(text){
  alert(text);
}
</script>
<form action="getText(/*here function for get text*/)">
   <input type="text" class="text"/>
   <input type="submit"/>
   <div></div>
</form>

如何使用纯javascript获取<form>中的textarea值哪里标明的？

Answer 1

action 属性包含表单将提交到的 URL，而不是 JavaScript。

如果你想用JavaScript处理表单数据，那么bind a submit event handler到它。这将在表单的上下文中触发，因此您可以通过 this 访问表单元素。

您可以通过 elements collection 访问表单控件。它们将具有包含其值的 value 属性。

<form action="/some/handler" id="myForm">
   <textarea name="myTextArea" class="text"></textarea>
   <input type="submit">
   <div></div>
</form>
<script>
function getText(text){
  alert(text);
}
function formSubmitHandler(evt) {
    var textarea = this.elements.myTextArea;
    getText(textarea.value);
}
document.getElementById('myForm').addEventListener('submit', formSubmitHandler);
</script>

如果您打算完全使用 JS 来处理表单(当 JS 可用时)，您可能希望调用 evt.preventDefault()。