需要使用prototypeJS的帮助

Question

我今天在一个新项目中使用prototypeJS遇到了一些问题，所以这是我的代码：

var div = $('addcontact');
Event.observe(div, 'click', respondToClick);
function respondToClick(event) {    
    var form = $('contactForm');
    form.setStyle(
          {display : initial}
    );
}

我不明白为什么它不起作用，$（'contactForm'）有一个显示：没有作为css属性，所以我想要做的就是在单击$（'addcontact'）时显示它。

Answer 1

原型有两个控制CSS display属性的Element方法： show()和hide() ，前提是初始值是内联设置的（视情况而定）。

因此，您的代码段可以按以下方式进行优化：

Event.observe($('addcontact'), 'click', function()
{ 
    $('contactForm').show();
});

另外， show()自动为涉及的元素设置适当的display属性： block ， ìnline ， table ， table-row等。 hide()将display设置为none 。

如果您想要一次show()或hide()几个元素，请使用以下形式：

$('element_1','element_2', ..., 'element_n').invoke('show');
$('element_1','element_2', ..., 'element_n').invoke('hide');

编辑

如果要根据事件打开/关闭元素的display属性，则：

Event.observe($('element'),'click', function()
{
    $('otherElement').toggle();
}