如何使用 jQuery 验证插件来验证具有此特定约束的表单？ [重复]

Question

我对 jQuery 很陌生，我有以下与表单验证相关的问题。

所以我认为不要自己编写验证器，而是使用jQuery Validation Plugin，这个：http://jqueryvalidation.org/

据我了解，它为我提供了内置的 required() 方法，该方法使特定字段成为必填字段（如果用户没有为此字段插入值，则会显示错误消息）。

好吧...我的问题是在我的表单中我有这样的东西：

<form method="post" action="consultazioneRicercaForm" id="consultazioneRicercaForm">

    <div class="row">
        <div class="col-md-4">

            <label style="display: block;">Regioni:</label>
            <select name="regioneSelezionata" id="selReg">
                <option value="-">--SELEZIONARE UNA REGIONE--</option>
                <option value="AB">ABRUZZO</option><option value="BA">BASILICATA</option><option value="CA">CAMPANIA</option><option value="CL">CALABRIA</option><option value="EE">REGIONE ESTERA</option><option value="EM">EMILIA ROMAGNA</option><option value="FR">FRIULI-VENEZIA GIULIA</option><option value="LA">LAZIO</option><option value="LI">LIGURIA</option><option value="LO">LOMBARDIA</option><option value="MA">MARCHE</option><option value="MO">MOLISE</option><option value="PI">PIEMONTE</option><option value="PU">PUGLIA</option><option value="SA">SARDEGNA</option><option value="SI">SICILIA</option><option value="TO">TOSCANA</option><option value="TR">TRENTINO-ALTO ADIGE</option><option value="UM">UMBRIA</option><option value="VA">VALLE D' AOSTA</option><option value="VE">VENETO</option>
            </select>
        </div>


        <div class="col-md-4">
            <label style="display: block;">Province:</label>
            <select name="provinciaSelezionata" id="selProv"><option value="">--SELEZIONARE UNA PROVINCIA--</option></select>
        </div>


        <div class="col-md-4">
        </div>

    </div>

    <div style="margin-top: 30px;" class="row">
        <div class="col-md-4">
            <label style="display: block;">Codice Meccanografico:</label>
            <input type="text" value="" name="codMec" id="selCodMec">
            </div>

            <div class="col-md-4">
                <label style="display: block;">Tipologia Progetto:</label>
                <select name="tipologiaProgettoSelezionato" id="selTipologiaProgetto">
                    <option value="-">--TIPOLOGIA--</option>
                    <option value="WIFI">WIFI</option><option value="LIM">LIM</option><option value="Altro">Altro</option><option value="Classi 2.0">Classi 2.0</option><option value="Scuola 2.0">Scuola 2.0</option><option value="CSD">CSD</option>
                </select>

            </div>


            <div class="col-md-4">
                <label style="display: block;">Stato Progetto:</label>
                <select name="statoProgettoSelezionato" id="selStatoProgetto">
                    <option value="-">--STATO PROGETTO--</option>
                    <option value="Da compilare">Da compilare</option><option value="In lavorazione">In lavorazione</option><option value="Da validare">Da validare</option><option value="Validato">Validato</option><option value="Rendicontato pregresso">Rendicontato pregresso</option>
                </select>

            </div>

        </div>

        <div style="margin-top: 30px;" class="row">
            <div class="col-md-12">
                <input type="submit" value="Cerca">
            </div>
        </div>
</form>

如您所见，它包含一些具有 id="selReg" 和 id="selCodMec" 的字段。

因此，我的验证仅关注前两个字段，特别是，如果具有 id="selReg" 的字段或具有 id="selCodMec" 的字段设置了值，则可以认为表单有效。因此，如果用户至少验证了这两个字段之一，我的表单就被认为是有效的。

我认为在这种情况下我不能使用 required() 方法，因为在我看来，required() 方法是在特定字段上引用的，并且没有实现之前的逻辑。

如何解决这个问题？我可以使用这个 JQuery 验证插件 来实现我的目的吗？

Answer 1

我也在我的一个项目中使用了 jQuery 验证。

尝试添加自己的验证规则：

$.validator.addMehtod('oneOrOther',function(value) {
  if(!$("#selReg").val() && !$("#selCodMec").val())
    return false;
  else
    return true;
});

将验证分配给字段：

$("#consultazioneRicercaForm").validate({
  ...
  rules: {
    regioneSelezionata: {
      oneOrOther: true
    }
   ...
  }
});

我希望我正确理解了你的问题。