jquery验证表单中的单项选择和多项选择实例

例如，在下面的选项中，我们要求带有*的选项是必需的。见图：。

看到上面的网页吗？在业务处理渠道下，必须多选一个。我该怎么办？如果没有选择它们，我们将在提交表单时提示一条错误消息。大家都知道jquery验证输入很简单，但是很少需要验证多选或者单选，而且还是分组验证，是分组的，不是页面上的全部！怎么办？用别的东西代替jquery，好吗？当然可以！然而，我们仍然使用jquery来实现它。我们来看看无选择的效果。我们应该是这样的：。

如果选择一个，提示信息会立即消失，如下图：。

其实这可以用jsmap来实现，也就是说可以用js map来模拟。以下代码是公共的。如果以后遇到这种情况，直接复制下面的js代码进行配置。有了下面的代码，就必须把用于jquery验证的js代码介绍如下：首先，把下面的js代码放到你的js文件中，或者把：代码复制到页面中如下：/***数组内存主要是为了方便juery验证checkbox，配置对象，验证checkbox和单选。*在私有变量区域定义数组*然后将每个数组配置成设置，这样数组就存在内存中*使用数组名的时候，可以很容易的操作得到不同的数组。*当你需要一个数组的时候，这个方法比你只操作一个数组更有效，但是如果你操作多个数组或者只有数组名，这个内存就非常有用了。* @ author * @返回数组内存对象*/varmaparr=(function(){ varbhc=[]，bcc=[]，bqc=[]，IC=[]；var BAC=[]；var BUC=[]；var设置=[ { key: 'BHC '，value: BHC }，{ key: 'BAC '，value: BAC }，{ key: 'BUC '，value: BUC }，{ key: 'BCC '，value: BCC }，{ key: 'BQC '，value: BQC }，{key:'IC '，value : IC }]；返回{//按数组名称获取数字Organization Getarr : Function(arr _ name){ for(var setting _ I=0，setting _ len=setting.lengthsetting _ i setting _ lensetting _ I){ if(setting[setting _ I]。key==arr_name) {返回设置[setting_i]。价值；}}}，//删除一个元素delar:函数(arr _ name，element value){ for(var delar _ I=0，delarr _ len=setting.lengthdelArr _ i delArr _ lendelar _ I){ if(设置[delar _ I]。key==arr_name) { for (var arr_i=0，arr _ len=setting[DelaRR _ I]. value . length；arr _ i arr _ lenarr_i ) { if(设置[delArr_i]。value[arr _ I]==ElEMENTValue){ setting[DelArr _ I]. value . splice(arr _ I，1)；}}}}}，//添加一个元素pusharr:函数(arr _ name，element value){ for(var push arr _ I=0，pusharr _ len=setting.lengthpushArr _ i pushArr _ lenpushArr_i ) { if(设置[pushArr_i]。key==arr _ name){ setting[PushArr _ I]. value . push(element value)；} } } }} ());/* * *复选框或单击事件应用于上图* @作者电子科技大学园区庄浦到* @返回数组内存对象*/functionchk (event，arrName) {if (event。checked==true){//添加元素maparr.pusharr (arrname，event。} else {//从名为arrName的数组中移除一个元素maparr.delarr (arrName，event . value)；} var check input=document . getelementbyid(arrName)；if(MapArr . GetArr(arr name)[0]==' undefined ' | | MapArr . GetArr(arr name)[0]==null){ CheckInput . value=null；//给他这个数组的值。这样就有了verification } else { check input . value=map arr . getarr(arr name)[0]的效果；}//如何让加值后提示消失？if(！$('#form1 ')。valid())返回false//只是为了让这个章节消失，所以不要运行提交的检查，这样会影响章节的显示。} 2:在需要验证的多项选择或单项选择的标题组后添加input:复制代码，如下所示： input tid=' BAC ' name=' BAC ' type=' text ' style=' width 33600；高度：0；border :0 ' class=' required '/3:在您的复选框或单选标签中添加事件：按如下方式复制代码：onclick='chk(this，' BAC')' 4:一致性：“2”中的输入用于提示信息，因此您的id和名称必须可用。而且名字要一致，如上图：id=' BAC '，name=' BAC '。输入写入后，当您加入事件时，您的第二个参数应该与输入的id同名，也就是BAC五：配置，face done，是核心配置，这个配置匹配在哪里，也就是要求你把它引入到我上面的js代码中。

Onlick=' chk (this，' BAC ')'，这是给每个检查或单选按钮添加事件，这也意味着这个检查应该应用于BAC数组，所以让我们在设置中配置一个数组。向MapArr添加一个数组：复制代码如下： var BAC=[]；在MapArr的设置中添加一个对象：复制代码如下： {key3360' bac '，value:bac}。确保一致性，否则不会成功。重要提示：输入的id与onclick的第二个参数一致。MapArr中添加的数组变量的变量名与输入的id一致，设置中key的值与输入的id一致。设置中的值是您配置的数组。好了，现在可以实现验证了。