Javascript HTML文本输入条件提交

我有一个页面，每次刷新都会加载一个随机的MP3文件。用户必须通过文本形式输入根据声音猜测名称。我想根据存储的字符串检查他们的输入，如果正确的话刷新页面。否则，我不想给他们一个错误的警告，让他们保持在同一页上，这样他们可以再次猜测：

<div class="ui-widget" align="center">
<form method="post" action="" class="answer_box" onsubmit="return submit();">
    <p>Which hero is it?  <input id="tags" name="guess"  /></p>
    <script>
        var key = <?php echo json_encode($rand_key) ?>;
        var info = document.getElementById("guess").value;

        function submit() {
            if (key==info){
                alert('Correct!');
                return true;
            }
            else {
                alert('Incorrect!');
                returnToPreviousPage();
                return false;
            }
        }
    </script>

</form>
</div>

是哪个英雄

var键=；
var info=document.getElementById（“猜测”）.value；
函数提交（）{
如果（键==信息）{
警惕（“正确！”）；
返回true；
}
否则{
警报（“不正确！”）；
returnToPreviousPage（）；
返回false；
}
}

---

现在，它将信息提交到新页面，而不考虑输入。javascript警报也没有显示（我怀疑它们确实显示了，但页面会刷新，然后消失）。key变量是PHP数组中随机取值的key，info应该是用户输入的文本。

这里有一个问题：

您的

id

是

标签

，而不是

猜测

您应该使用

document.getElementById（“标记”）.value

发现问题：

您不能将

submit

用作函数名，因为这是一个HtmlForm对象

document.getElementById（“猜测”）.value

正在查找ID为“guess”且不存在的元素

我会像这样重写你的脚本：

<script>
    var key = <?php echo json_encode($rand_key) ?>;

    function my_submit(curr) {
        var info = curr.guess.value;
        if (key == info) {
            alert('Correct!');
            return true;
        }
        else {
            alert('Incorrect!');
            returnToPreviousPage();
            return false;
        }
    }
</script>

<form onsubmit="return my_submit(this);">
    <p>Which hero is it? <input id="tags" name="guess"/></p>
</form>

var键=；
功能my_提交（当前）{
var info=curr.guess.value；
如果（键==信息）{
警惕（“正确！”）；
返回true；
}
否则{
警报（“不正确！”）；
returnToPreviousPage（）；
返回false；
}
}
是哪个英雄

您正在尝试检索id为“guess”的元素的值。请将其更改为“tags”

---

此外，正如@CodeGodie所提到的，您需要将函数名更改为submit以外的其他名称

老实说，这不是一种非常安全的方法，他们可以打开脚本并在那里看到密钥。您能提供

$rand_key

的内容吗？向我们展示

var_dump（json_encode（$rand_key））结果。您是否尝试通过按钮输入而不是表单来触发JS？似乎是一种更好的方法（不管@MinusFour comment，这也应该考虑）@CodeGodie:AFAIK，
submit
是HtmlForm对象的一种方法，在
document.forms[0].submit（）中使用
@JoelAlejandro感谢CodeGodie的分解，因为
submit
正是HtmlForm对象的一部分，它可以用作JS全局对象，它与任何其他函数都不冲突。您可以在这里打开F12并键入
窗口。submit
或
submit
轻松检查这一点。在这两种情况下，您都会得到
未定义的
。这非常有效！我也用event.preventDefault（）替换了returnToPreviousPage（），它的工作原理与应有的完全相同。非常感谢。
var info = document.getElementById("tags").value;