javascript - JS 切换(显示)文本最简单的方法

Question

我正在尝试切换以通过下一种方式更改可见性(显示)文本 http://jsfiddle.net/xL8hyoye/ .它不起作用，但应该起作用。

此处的 HTML 代码:

<a href="#" onclick="toggle_visibility('foo');">Click here to toggle visibility of element #foo</a>
<div id="foo">This is foo</div>

这里是JS代码:

function toggle_visibility(id) {
   var e = document.getElementById(id);
   if(e.style.display == 'block')
      e.style.display = 'none';
   else
      e.style.display = 'block';
}

(code from this source http://blog.movalog.com/a/javascript-toggle-visibility/)

---

替换时解决:

function toggle_visibility(id) {

作者:

toggle_visibility = function(id) {

(感谢 Zakaria Acharki)。

这样做的原因是可见变量区域，在第一种情况下 - JSFiddle 外部库设置(设置无库后，您需要设置“No wrap in head”)。 正如 amit.rk3 在这里所说的类似主题

Inline event handler not working in JSFiddle

这里是证明(js 和 html 代码没有改变，只有'No wrap in head'设置)http://jsfiddle.net/xL8hyoye/3/

Answer 1

更新您的函数声明，请参阅 working Fiddle :

toggle_visibility = function(id) {
   var e = document.getElementById(id);
   if(e.style.display == 'block')
      e.style.display = 'none';
   else
      e.style.display = 'block';
}