javascript - 以 Ruby on Rails 形式显示/隐藏 div

Question

我对此感到绝望和沮丧:如何在我的表单中显示隐藏一个或多个 div (Ruby on Rails)？

我浏览了论坛并尝试了以下所有方法，但都没有成功:

我在局部 View _form.html.erb 中试过这个

    <div id="foo">foo</div>
    <a href="#" onclick="Element.toggle('foo'); return false;">toggle foo</a>

我试过了

    <div id="foo">foo</div>
    <%= link_to_function('toggle foo', "Element.toggle('foo')") %>

我试过了

    <div id="foo" class=foo_class>foo</div>
    <a href="#" onclick="$$('.foo_class').each(Element.toggle);">toggle foo</a>

我试过了

    <a href="javascript:void(0);" onclick="showHide('foo');">toggle foo</a>

其中showHide(elementId)定义如下

    <script language="javascript" type="text/javascript">
    function showHide(elementId) {
        if (document.getElementById) {
            var element = document.getElementById(elementId);
            if (element.style.visibility == 'hidden') {
                element.style.visibility = 'visible';
            } else if (element.style.visibility == 'visible') {
                element.style.visibility = 'hidden';
            }
        }
    }
    </script>

我还尝试了相同的 showHide 函数，显示无/ block 而不是可见性隐藏/可见

我的 layouts/application.html.erb 的头部有这一行

    <%= javascript_include_tag :defaults %>

我在论坛上找到的这些解决方案都不适合我。

那么，我在这里缺少什么？为什么其他人证明有效的所有解决方案仍然对我不起作用？

Answer 1

如果您的元素的可见性是“”(意思是未设置，这是它的默认值)，您将不会对 showHide 做任何事情。这可能就是为什么这种方法不起作用的原因。将对象隐藏(仍然会占用布局空间)和隐藏对象(不会占用任何空间)之间也有区别。

这是做什么的？:

$('foo').toggle();

或

$('foo').invoke('toggle');

也许您正在使用旧的 jQuery 库。