【问题标题】：page reloads when using document.getElementById使用 document.getElementById 时页面重新加载
【发布时间】：2016-09-27 08:02:35
【问题描述】：

当用户点击按钮时，我使用下面显示的 js 函数使页面的一部分消失。

但是当我单击按钮时，该部分确实消失了，但随后页面重新加载。为什么会这样？

<button id="myDIV" onclick="fncShowHide()">Try it</button>

<script>
window.fncShowHide = function() {
   document.getElementById("idein").className = "display-none";
}
</script>

【问题讨论】：

<button type="button" id="myDIV" onclick="fncShowHide()">Try it</button>
是表单中的按钮吗？
@leo — 如果 NO，我们会不会退出开发..
@Rayon SIMPLE .. 非常感谢 :) .. 我不懂 js :/
冷静下来，伙计们..我知道这是一个愚蠢的错误:)))

标签： javascript

【解决方案1】：

见What's the standard behavior when < button > tag click?。

从onclick 处理程序返回false 以防止任何默认浏览器操作。

<button id="myDIV" onclick="fncShowHide(); return false;">Try it</button>

【讨论】：

【解决方案2】：

?

window.fncShowHide = function() {
   document.getElementById("idein").className = "display-none";
}

window.other_ = function() {
   document.getElementById("idein").style.display = "none";
}

.display-none{
display:none;
}

<button id="myDIV" onclick="fncShowHide(); return false;">Try it</button>
<div id="idein">BYEEEEEEEEEEEEEEEEEEEEEEEEEEE!</div>
<script>

</script>

【讨论】：