Question

我正在尝试使用javascript对动态表单进行编码，根据是否选中了复选框来显示或隐藏元素。

在大多数情况下，它可以正常工作。我定义了读取复选框值的方法，并相应地重新排列页面，然后将它们设置为复选框的onclick方法。然后我还将它们设置为在文档加载上运行一次，以便用户在刷新时正确呈现页面，代码如此Event.observe(window, 'load', manageCheckbox1);（这使用Prototype库将其设置为在加载时运行;我是不确定为什么这比仅仅在原始调用html中放置在html之后的所有相关元素更好，但这就是我看到别人这样做的原因。

然而，这种方法的问题在于，在运行javascript之前，页面在加载时可见一秒钟，然后所有元素在javascript插入或删除元素时跳转。

有没有更好的方法来避免这种不愉快的跳跃效应？

Answer 1

通过css规则使表单不可见，并在通过函数重新排列后使用原型库将其设置为可见。

所以你的表格就像是

<form ...... class="just_loading">

你应该有

.just_loading{display:none;}

并在您的manageCheckbox1函数中添加

$$('.just_loading').removeClassName('just_loading');

<强> 更新
如果您希望页面也可以在没有javascript的情况下工作，请使用以下命令创建css规则。

<script type="text/javascript">
  document.write( '<style type="text/css">.just_loading{display:none;}</style>' );
</script>

这样，如果禁用javascript，则根本不会创建隐藏表单的规则..

避免动态表单中的Javascript跳转元素

1 个答案: