例如下的選項中，我們要求帶*的是必選的，看圖：
看到上面網頁沒？業務辦理渠道下的多選必須要選中一個，怎麼辦？如果一個都沒有選中，在表單提交的時候我們就要去提示錯誤信息，，，。大家都知道jquery驗證input是非常簡單的，卻很少要去驗證多選或單選，而且還是一組組的驗證，是分了組的，並非頁面上的所有！！怎麼辦呢？
不用jquery用其他的，可以嗎？可以！！！不過我們還是用jquery來實它。
先來看一下，沒有選中的效果，我們應該是這樣：
假設選中了一個，提示信息馬上消失，如下圖：
其實這個可以用jsmap來實現 也就是用js模擬map來做。以下的代碼是公用的，以後遇到這種情況，直接把下面js代碼拷入，做一下配置就可以實現了。
用下面的代碼，你必須要引入jquery驗證的js
代碼如下：
首先，把下面的js代碼放入你的js文件裡，或是頁面中:
. 代碼如下:
/**
* 數組存儲器 主要是為了方便juery驗證chckbox而設計 數組存儲器，配置對象，為驗證checkbox 和單選。
* 私有變量區定義數組
* 然後把每一個數組配置到setting裡面，這樣這個數組就存在於存儲器中
* 在應用的時候用數組名即可方便地操作和得到不同的數組。
* 當你需要某個數組的時候，如果你只操作一個數組那這個方法是多於的，但如果你操作多個數組或只有數組名的情況下，這個存儲器就很有用。
* @author 電子科大科園 莊濮向
* @return 數組存儲器對象
*/
var MapArr = (function () {
var BHC = [], BCC = [], BQC = [], IC = [];
var BAC = [];
var BUC = [];
var setting = [
{
key: "BHC",
value: BHC
},
{
key: "BAC",
value: BAC
}, { key: "BUC", value: BUC }, { key: "BCC", value: BCC }, { key: "BQC", value: BQC }, {key:"IC",value:IC}
];
return {
//通過數組名得到數組織
getArr: function (arr_name) {
for (var setting_i = 0, setting_len = setting.length; setting_i < setting_len; setting_i++) {
if (setting[setting_i].key == arr_name) {
return setting[setting_i].value;
}
}
},
//刪除指定數組中的某一個元素
delArr: function (arr_name, elementValue) {
for (var delArr_i = 0, delArr_len = setting.length; delArr_i < delArr_len; delArr_i++) {
if (setting[delArr_i].key == arr_name) {
for (var arr_i = 0, arr_len = setting[delArr_i].value.length; arr_i < arr_len; arr_i++) {
if (setting[delArr_i].value[arr_i] == elementValue) {
setting[delArr_i].value.splice(arr_i, 1);
}
}
}
}
},
//向某一個數組中添加一個元素
pushArr: function (arr_name, elementValue) {
for (var pushArr_i = 0, pushArr_len = setting.length; pushArr_i < pushArr_len; pushArr_i++) {
if (setting[pushArr_i].key == arr_name) {
setting[pushArr_i].value.push(elementValue);
}
}
}
}
} ());
/**
*復選框或單選的點擊事件 應用到了上面的map
* @author 電子科大科園 莊濮向
* @return 數組存儲器對象
*/
function chk(event, arrName) {
if (event.checked == true) {
//向名為arrName的數組中添加一個元素
MapArr.pushArr(arrName, event.value);
} else {
//在名為arrName的數組中去除一個元素
MapArr.delArr(arrName, event.value);
}
var checkInput = document.getElementById(arrName);
if (MapArr.getArr(arrName)[0] == 'undefined' || MapArr.getArr(arrName)[0] == null) {
checkInput.value = null; //把這個數組的值給他。 這樣的話，就起到了驗證的效果
} else {
checkInput.value = MapArr.getArr(arrName)[0];
}
//如何讓提示信息在加入值過後就消失掉？
if (!$("#form1").valid()) return false; //只是為了讓這一章展開的消失，所以千萬不要去運行提交的那個check,會影響章節的顯示
}
二：在你需要驗證的多選或單選的那一組標題後面加入一個input:
. 代碼如下:
<input id="BAC" name="BAC" type="text" style="width:0;height:0;border:0" class="required" />
三：在你的checkbox或是radio標簽內加入事件：
. 代碼如下:
onclick="chk(this,'BAC')"
四：一致性：在"二"中的那個input是用來作提示信息的，所以你的id 和name 一定要有，且名字要一致，如上就是：id="BAC", name="BAC" ,input寫好過後，在加入事件的時候，你第二個參數要與input的id同名，也要是BAC;
五：配置，面子做好了，就是核心的配置了，這個配置在哪兒配呢，就是叫你引入的我上面的js代碼中。onclick="chk(this,'BAC')"，是給每一個復選或單選加事件，同時還有一個意思，說明要把這個復選應用到BAC這個數組中，所以，我們去setting中配置一個數組。
在MapArr中加入一個數組:
. 代碼如下:
var BAC=[];
在MapArr的setting中加入一個對象：
. 代碼如下:
｛
key:"BAC",
value:BAC
｝
千萬要保證一致性，不然不會成功。
重點：input的id同onclick的第二個參數一致 MapArr中加入的數組變量的變量名與input的id一致，setting中的key的值同input的id一致 setting 中的value的值是你配置的這個數組。好啦，現在就可以實現驗證了。