输出消失 Javascript 简单的 innerHTML

Posted 2023-05-07

【中文标题】输出消失 Javascript 简单的 innerHTML

【英文标题】：Output disappeared Javascript simple innerHTML

【发布时间】：2012-11-25 18:01:39

【问题描述】：

我是 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>

【问题讨论】：

您正在提交带有按钮的表单，请尝试将类型从“提交”更改为“按钮”

【参考方案1】：

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

如果你想在用户点击提交时运行unesi函数并阻止HTML表单提交，你需要稍微改变一下：

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

return false 阻止表单自行提交。

【讨论】：

感谢您的回复，我现在明白了，我不会没有您的解释。但是你的代码没有任何好处，它仍然刷新。唯一可行的方法是从代码中删除

【参考方案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()">

【讨论】：

我做了你的第一个选项，但它仍然被刷新，第二个......唯一有效的就是从代码中删除

【参考方案3】：

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

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

到

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

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

【讨论】：

谢谢，非常有帮助的 cmets。