Question

我是javascript的新手，在每一个简单的事情上我都遇到了一些问题，但这对我来说似乎无法解决。我用谷歌搜索，没有任何相似之处。

在我将数据输入文本框并将其存储到变量后，我打印出段落中的变量。问题是打印出的输出在不到一秒的时间内消失。代码似乎是正常的，可能是什么？当你不把getch（）时，它看起来像c; 提前谢谢。

<form>Unesite broj koji ce se ispisat kasnije.<br>
<input type="text" id="userInput">
<input type="submit" name="unos" value="Unesi i ispisi" onclick="unesi()"><br><br>

</form> 
    <br><br>
<p>Unjeli ste <b id="ispis"></b></p>
<script>
function unesi(){
var userInput = document.getElementById('userInput').value;
document.getElementById('ispis').innerHTML = userInput;
}   

</script>

Answer 1

<form>标记没有指定action属性，因此当您点击提交按钮时，浏览器会将表单提交到当前网址 - 这看起来很像页面很新鲜。

如果您想在用户点击提交时运行unesi功能并阻止提交HTML表单，则需要稍微更改一下：

<input type="submit" name="unos" value="Unesi i ispisi"
      onclick="unesi(); return false;">

return false会阻止表单自行提交。

Answer 2

因为表单提交并刷新页面。取消表单请求。

<input type="submit" name="unos" value="Unesi i ispisi" onclick="return unesi()">

和功能

function unesi(){
    var userInput = document.getElementById('userInput').value;
    document.getElementById('ispis').innerHTML = userInput;
    return false;
}

更好的选择是在表单级别上执行

<form action="#" method="get" onsubmit="return unesi()">

Answer 3

而不是取消表单提交，另一种选择是更改

<input type="submit" name="unos" value="Unesi i ispisi" onclick="unesi()">

到

<input type="button" name="unos" value="Unesi i ispisi" onclick="unesi()">

这将使按下按钮时表单不会尝试提交。

输出消失Javascript简单innerHTML

3 个答案: