jQuery验证插件，如果另一个为空，则一个字段必须为空

Question

我有一个具有多个地址字段的表单。我想只允许在一个字段中输入，如果前面的字段已填写。我正在使用jquery验证，并且希望继续这样做。这个想法是，虽然这些领域实际上都不需要，除了第一个领域，你不能在其余领域留下空白。因此，如果字段3为空，则字段4中不能有数据。一种方法可能是仅在数据输入到前一个字段时启用字段，但不知道在此情况下如何执行该操作。

Answer 1

继续我上面的评论。

有了基本的jQuery选择，你可以选择“前一个”使用.prev()运行功能元素。

在伪代码方面，所以你要确保你是你可以做这样的事情

if (anAddressTextBox.prev().val() != '') { // ps: again, this is pseudo-code 
    // allow current text object 
} 

您可能也想看看.closest()和.siblings()

验证上述部分与匹配的类名总是在你的地址范围内。 （即：不检查的另一个随机领域是不是一个地址文本框）

添加一些你的HTML/JS/jQuery代码那么那么社会将能够提供更好的解决方案:)

Answer 2

你的解释是有点不清楚。我从来没有听说过任何人想让场地保持空虚......要么是required要么是他们的optional。

这是一个两部分答案：

1）演示如何使用depends选项与:filled和:blank自定义选择一起。因此规则的应用可能取决于另一个字段是填充还是留空。

2）展示了如何编写如果该字段没有留空，让一个错误的自定义规则。

末最后的jsfiddle结合了这两个。

---

You can use a depends function使required规则依赖于另一个领域。

在这个例子中，所有的字段都开始“可选”。但是，每一个都取决于以前。如果field #1被填满，然后field #2成为required等You could also use the :blank custom selector in place of the :filled to check the opposite。

你可以改变周围的这个以适应几乎任何情况。

DEMO：http://jsfiddle.net/Rvhmd/

jQuery的：

$(document).ready(function() { 

    $('#myform').validate({ // initialize the plugin 
     rules: { 
      field2: { 
       required: { 
        depends: function (element) { 
         return $("#field1").is(":filled"); 
        } 
       } 
      }, 
      field3: { 
       required: { 
        depends: function (element) { 
         return $("#field2").is(":filled"); 
        } 
       } 
      }, 
      field4: { 
       required: { 
        depends: function (element) { 
         return $("#field3").is(":filled"); 
        } 
       } 
      } 
     } 
    }); 

}); 

HTML：

<form id="myform"> 
    <input type="text" name="field1" id="field1" /> 
    <input type="text" name="field2" id="field2" /> 
    <input type="text" name="field3" id="field3" /> 
    <input type="text" name="field4" id="field4" /> 
    <input type="submit" /> 
</form> 

---

为了向OP提供他所要求的内容，这里有一个自定义的方法/规则，称为empty，如果该字段不为空，将会给出错误。

$(document).ready(function() { 

    $.validator.addMethod('empty', function(value, element) { 
     return (value === ''); 
    }, "This field must remain empty!"); 

    $('#myform').validate({ // initialize the plugin 
     rules: { 
      field: { 
       empty: true // error if field is not empty 
      } 
     } 
    }); 

}); 

工作演示：http://jsfiddle.net/4C2U3/

---

你可以用上面的depends选项来实现任何你想结合这个习俗empty规则。

 rules: { 
      field: { 
       empty: { 
        depends: function (element) { 
         return $("#other_field").is(":blank"); 
        } 
       } 
      } 
     } 

这是最接近我认为OP希望：

http://jsfiddle.net/qCJ8T/

Answer 3

正待回答您的上述要求，通过使用最大长度= 0的验证，我们能够有一个有效的但是必需的空字段。它来自于JQuery验证支持论坛：

rules: { 
    "fieldName" : {maxlength:0} 
} 

当然，你将需要修改的休息，但是这是一个简单的方法让我们有一个字段是有效的，只有当它是空白（又名最大长度= 0 ）