0
該頁面包含多個表單，其中每個表單都已經驗證實施沒有問題。由於某些情況，我不得不使用addMethod進行jquery驗證，以便使select2.js按照我的需要工作。如果select的值爲0，則驗證返回false。 addMethod爲1表單工作，當我添加其他表單的addMethod時，驗證似乎無法正常工作。jQuery多頁表單驗證1頁添加方法
方案
點擊「報告」按鈕，左上方>則點擊轉換率報告按鈕的形式將顯示一個，點擊「搜索」按鈕，然後在錯誤信息將會呈現。默認情況下，當輸入字段有值時，錯誤消息將分別消失。至於select2下拉列表，錯誤信息仍然存在（奇怪），即使其中有值，而不是「選擇國家」。截至目前，即使您打開另一個表單，錯誤消息仍然會持續存在。現在點擊「國家報告」按鈕，將出現另一個表格，點擊搜索按鈕，由於輸入字段爲空，現在會顯示錯誤信息，現在從select2下拉列表中選擇一個國家。錯誤消息消失（好）。在此過程中，返回轉化率報告表單，然後您會看到select2錯誤消息已消失。即使我改變了它的選擇，它也不會再觸發錯誤信息。
我知道它有很多需要閱讀的內容，但請幫助你的同道「中級」前端開發者，謝謝！
HTML元素
<form id="search_country_report_form" action="con_sum.html">
<span class="close_search_pop lnr lnr-cross"></span>
<div class="report_search block_padding">
<h2>Search Country report</h2>
<ul class="report_search_date_range clearfix">
<li><span><b>Date range*</b></span></li>
<li>
<label>From</label><input type="text" readonly="readonly" name="startStringDate" id="search_country_date_from" />
</li>
<li>
<label>to</label><input type="text" readonly="readonly" name="endStringDate" id="search_country_date_to" />
</li>
</ul>
<ul class="report_search_top_cat clearfix">
<li>
<label><b>Country name*</b></label>
<select id="search_country_country_name" name="countryName">
<option value="0">Select country</option>
<option value="TH">Country #1</option>
<option value="MY">Country #2</option>
</select>
</li>
</ul>
<div class="btn_wrap clearfix">
<button class="search_btn" type="submit">Search</button>
</div>
</div>
</form>
jQuery腳本
$("form").each(function() {
var search_country_report = $('#search_country_report_form');
$.validator.addMethod("countryNameCheck", function (value) {
var theField = $("#search_country_country_name");
if (theField.val() === '0') {
console.log($("#search_country_country_name").val());
return false;
} else {
return true;
console.log($("#search_country_country_name").val());
}
});
var validobj = search_country_report.validate({
rules: {
startStringDate: {
required: true
},
endStringDate: {
required: true
},
countryName: {
required: true,
countryNameCheck: true
}
},
messages: {
startStringDate: "Required",
endStringDate: "Required",
countryName: "Country name is required"
},
onKeyUp: true,
errorElement: 'span',
errorClass: "searchErrorText",
errorPlacement: function (error, element) {
var elem = $(element);
error.insertAfter(element);
},
highlight: function (element, errorClass, validClass) {
var elem = $(element);
if (elem.hasClass("select2-offscreen")) {
$("#s2id_" + elem.attr("id") + " span").addClass(errorClass);
} else {
elem.addClass(errorClass);
}
},
unhighlight: function (element, errorClass, validClass) {
var elem = $(element);
if (elem.hasClass("select2-offscreen")) {
$("#s2id_" + elem.attr("id") + " span").removeClass(errorClass);
} else {
elem.removeClass(errorClass);
}
}
});
var thisParent = $('.select2-selection').parent();
$(document).on("change", thisParent, function() {
if (!$.isEmptyObject(validobj.submitted)) {
validobj.form();
}
});
$(document).on("select2-opening", function (arg) {
var elem = $(arg.target);
if ($("#s2id_" + elem.attr("id") + " span").hasClass("myErrorClass")) {
$(".select2-drop span").addClass("myErrorClass");
} else {
$(".select2-drop span").removeClass("myErrorClass");
}
});
search_country_report.submit(function() {
validobj.form();
});
});