我正在创建一个 JavaScript 小书签来切换页面上 HTML 元素的可见性,但隐藏该元素似乎很麻烦:
http://codepen.io/anon/pen/HtkzL
代码:
<div id="hideme">
<p>I am a div that needs to be hidden</p>
</div>
<p>I am a paragraph that doesn't need to be hid.</p>
<blockquote>
I am a blockquote that the whole world must see
</blockquote>
<a href="javascript:var a=document.getElementById('hideme');a.style.display='none';">Click me to hide the div.</a>
发生的事情是点击每个 anchor 链接,整个页面变为空白并显示“无”。
当我在 <a> ... </a>
中注入(inject)完全相同的代码时在 JS 控制台中,它工作得很好。
是否有可能解决该问题?
最佳答案
它实际上是在隐藏元素,但它也在紧跟着您的 anchor 之后(无处可去)。您可以返回 false 或 falsy 值。我将其包装在 void
中,这将返回 undefined,但两者都可以。这是您的代码笔和代码:http://codepen.io/anon/pen/dsgKk
<a href="javascript:void(function(){ var a = document.getElementById('hideme'); a.style.display='none'; })();">Click me to hide the div.</a>
(这也可以,但不太干净,imo):
<a href="javascript:var a=document.getElementById('hideme'); a.style.display='none'; return false;">Click me to hide the div.</a>
关于Javascript 书签导致页面空白,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20622409/