Javascript 书签导致页面空白

标签 javascript html bookmarklet

我正在创建一个 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/

相关文章:

javascript - 确定主要现代浏览器的浏览器类型和版本

javascript - 无法验证跨平台请求的 Rails 上的 CSRF token 真实性

javascript - 填充图和填充图的区别

javascript - 删除 maxlength 属性

javascript - 通过书签发布到 Wayback Machine

javascript - 防止默认后重新启用提交

html - 透视元素内的 Firefox 渲染错误

javascript - 单击子元素时阻止父类

javascript - JS Bookmarklet - 脚本无法在某些网站上运行

javascript - 使用 js 添加/更改 favicon