0

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

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

例如： 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>
4

2 回答 2

0

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

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

于 2012-10-06T03:36:21.493 回答
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)" />

更新脚本以允许新的 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 来获取和设置来自 Facebook 窗口中不同字段的值。

注意：您必须小心放置脚本的位置。这取决于您的应用程序，但有时您可能希望将脚本放在根文档而不是 facebox 页面中，因为如果您加载远程 facebox div，您的范围会发生变化，并且可能需要参考 parent.document 来访问父字段该脚本嵌入在远程 facebox div 中。

于 2012-09-14T13:24:34.920 回答