简单的 Web 表单文本字段不返回任何内容答案

【问题标题】：Simple web form text field returns nothing简单的 Web 表单文本字段不返回任何内容
【发布时间】：2020-05-18 19:43:40
【问题描述】：

我遇到了一个非常令人费解的问题，我有一个非常简单的（阅读，新手试图理解）网络表单。表单如下所示：

<form id="myform">
      <input type="text" name="t" id="t" />
      <input type="submit" id="sub" value="Submit" />
</form>

然后我还有一些非常简单的 js，我只是想用它来检查用户在做其他事情和提交之前的价值是什么。


function search() 
{
    var form = document.querySelector("form");
    s = form.elements[0].value;
    alert(form.elements[0].type);
    alert(form.elements[0].value);
}

我不明白为什么，无论我做什么，第一个警报都会显示我想要的“文本”类型，而第二个警报根本不返回任何内容。字段中的内容无关紧要，当我提交时，它甚至在 javascript 捕获它之前就消失了。

我也试过了

document.forms["myform"].addEventListener("submit", function(event) {
    event.preventDefault();
});

它似乎对我刷新时页面总是提交的事实没有影响，但它确实阻止了我的按钮提交。

;tldr 我只想要文本字段中的文本值，以便进行一些验证，但它始终为空。

编辑

如果我可以“关闭”问题，请告诉我。问题是我如何将函数绑定到按钮，我什至没有考虑过。小心那些“（）”

【问题讨论】：

标签： input webforms submit

【解决方案1】：

您可能需要将关键字“搜索”更改为其他内容，例如：

<script type="text/javascript">
    function doSearch() {
        var t = document.getElementById('t');
        alert(t.type);
        alert(t.value);
    }
</script>

那么这将起作用：

<input type="text" name="t" id="t" />
<input type="submit" id="sub" value="Submit" />
<a href="#" onclick="doSearch(); return false;">do search</a>

【讨论】：