如何验证facebox中的表单字段?

时间:2012-06-28 21:05:52

标签: javascript forms facebox

我需要验证facebox中显示的表单字段。

问题是我无法使用javascript获取字段的值。

表示ex:document.form.field_name.value不返回其值。

代码示例:

<script type="text/javascript">
function validate()
{
  if (document.form1.field.value=='')
{
   alert ("Field cannot be left blank");
}
}

</script>


<form name="form1" onsubmit="return validate()">
<input type="text" name="field" /> 

</form>

2 个答案:

答案 0 :(得分:0)

执行此操作的方法是将值直接从表单传递给验证代码。

<form name="form" id="form" onsubmit="return validate(this.field.value)">
<input type="text" id="field" /> 
</form>

或者你甚至可以使用没有表格的文本框:

<input type="text" id="field" 
onkeydown="if (event.keyCode == 13) return validate(this.value)" />

更新脚本以允许新值参数:

<script type="text/javascript">
 function validate(val) {
   if (val.length < 1)
   {
      alert ("field cannot be left blank");
      return false; //to stop the default action of submitting the form
   } else {
      alert ("Value: "+val);
      return true; //allow to submit the page
   }
 }

</script>

这实际上是一个非常简单和简单的验证,但是不要忘记根据您是否希望系统继续提交来设置返回操作。

我不确定您从远程html地址或本地存储的div中提取页面的位置。所以我不确定为什么你从DOM中提取价值的解决方案不起作用。我通常使用jquery来获取和设置facebox窗口中不同字段的值。

注意:在放置脚本的地方必须小心。这取决于您的应用程序,但有时您可能希望将脚本放在根文档而不是facebox页面中,因为如果加载远程facebox div,则会更改范围,并且可能需要引用parent.document来访问父字段该脚本嵌入在远程facebox div中。

答案 1 :(得分:0)

Facebox复制显示的DOM块,有效地创建具有重复ID的元素。 HTML标准不允许这样做。你的javascript会疯狂寻找由其id唯一标识的单个元素,但它会找到其中的2个......

这是Facebox中的一个巨大错误。 facebox中的任何代码都不应包含id。显示面部框时,应更新所有绑定。