jQuery和jquery.validate只有在顯示div時驗證表單元素（顯示/隱藏）

驗證我的表單，我已經包含了html代碼片段。對於我的配置文件類型，如果在配置文件類型中選擇值2，則使用顯示/隱藏編碼來顯示另一個div。我需要在這裏發生的是jquery.validate只驗證div id="pro2"的表單元素，如果沒有，那麼不顯示錯誤，因爲它沒有完成。jQuery和jquery.validate只有在顯示div時驗證表單元素（顯示/隱藏）

問題是我該怎麼做？

<script type="text/javascript"> 
$(document).ready(function() { 
    function showDiv(element, pro2) { 
     if (pro2.children("option:selected").val() == 2) element.show(); 
     else element.hide(); 
    } 
    var myElement = $("div#pro2"); 
    var mypro2 = $("select#ptype"); 
    $("select").change(function() { 
     showDiv(myElement, mypro2) 
    }); 
    $("#ctry").change(function() { 
     $(".state").hide(); 
     var stateSelect = $("#state_" + $(this).val()); 
     stateSelect.show();  
    }); 
    $("input[data-code]").each(function() { 
     $(this).autocomplete("/js/zip/" + $(this).data("code") + ".php", { 
     matchContains: true, matchFirst: true, mustMatch: false, 
     selectFirst: false, cacheLength: 10, minChars: 1, autofill: false, 
     scrollHeight: 150, width: 180, max: 20, scroll: true 
     }); 
    }); 
    $("#form1").validate({ 
     errorLabelContainer: $("#form1 div.error") 
    });  
    // $("#reg_form").validate();  
}); 
</script>

HTML代碼：

<div class="error"></div>  
<label>Profile Type:</label> 
      <select name="add[type]" id="ptype" 
      title="Select Profile Type!" class="{validate:{required:true}}"> 
      <option value="">-- Select</option> 
      <option value="2">(MF/FF/MM)</option> 
      <option value="1">F or M</option> 
      </select> 


    <div id="pro1">   
      <label>First Name:</label> 
      <input type="text" name="add[name]" size="20" maxlength="15" id="fname" 
      title="Your First Name" class="{required:true,minlength:1}"/> 
      <span class="rsmall">internal use not displayed</span><br /> 
    </div> 
    <div id="pro2"> 
      <label>First Name:</label> 
      <input type="text" name="cpl[name]" size="20" maxlength="15" id="fname" 
      title="Your First Name" class="{required:true,minlength:1}"/> 
      <span class="rsmall">internal use not displayed</span><br /> 
    </div>

來源

2011-12-03 acctman

其實這應該工作。 jquery.validate在默認情況下忽略所有隱藏的字段（如果你想自定義這種行爲，它有一個選項「ignore」，默認設置爲「：hidden」）。

Ther在你的代碼中有兩件奇怪的事情，你的輸入字段使用相同的id「fname」，而不是class="{required:true,minlength:1}"它應該是class="required" minlength="1"。至少在jquery.validate plugin I am using。也許你正在使用不同的插件或舊版本？

來源

2011-12-03 23:45:24 Cito

謝謝，我不知道它會忽略隱藏的字段。我在第一個演示中也使用了相同的jquery.validate http://jquery.bassistance.de/validate/demo/errorcontainer-demo.html'class =「{required：true，minlength：1}」' – acctman

jQuery和jquery.validate只有在顯示div時驗證表單元素（顯示/隱藏）

回答

相關問題