我有一个页面,每次刷新时加载一个随机的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>
现在,不管输入是什么,它都将信息提交到一个新的页面。javascript警报也没有显示(我怀疑它们确实显示了,但页面随后刷新,它们消失了)。key变量是PHP数组中随机取值的键,info应该是用户输入的文本。
发现问题:
- 你不能使用
submit
作为函数名这是一个HtmlForm对象 -
document.getElementById("guess").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>
这里有问题:
<input id="tags" name="guess" />
你的id
是tags
,不是guess
。
你应该使用document.getElementById("tags").value
您正在尝试检索id为"guess "的元素的值。将其更改为"tags"。"
var info = document.getElementById("tags").value;
另外,正如@CodeGodie提到的,您需要将函数名更改为submit以外的名称。