假设目前有两行select分别为id cat 和 cow，js控制当value时空的option被选择时触发required输出错误信息
js省略大部分
<select name="cat1" id="cat1" required>
<option value="">ーoption>
<option value="1">1option>
<option value="2">2option>
<option value="3">3option>
select>
<select name="cat2" id="cat2" required>
<option value="">ーoption>
<option value="1">1option>
<option value="2">2option>
<option value="3">3option>
select>
<select name="cow1" id="cow1" required>
<option value="">ーoption>
<option value="1">1option>
<option value="2">2option>
<option value="3">3option>
select>
<select name="cow2" id="cow2" required>
<option value="">ーoption>
<option value="1">1option>
<option value="2">2option>
<option value="3">3option>
select>
<div class="errorMsg">div>
<span>一个触发页面跳转页面span>
<script>
cat1: function(){
this.validObj.challenge('cat1', 'cat1') && this.validObj.required();
},
cat2: function(){
this.validObj.challenge('cat2', 'cat2') && this.validObj.required();
},
cow1: function(){
this.validObj.challenge('cow1', 'cow1') && this.validObj.required();
},
cow1: function(){
this.validObj.challenge('cow1', 'cow1') && this.validObj.required();
},
$.fn.form_check = function(e) {
var e = e || window.event;
var page = $.mobile.activePage;
$('div.inner,input', page).removeClass('error');
$('p.errorMessage,div.errorBox', page).remove();
$('span', page).removeClass('admission').removeClass('invalid');
if (e && $(e.target).closest('a').hasClass('back')) {
return true;
}
var v = new Validator();
var valid1 = new validationObj({
validObj: v
});
valid1.cat1();
valid1.cat2();
valid1.cow1();
valid1.cow2();
return !v.has_errors();
};
这样的话四个select都会在未输入时显示未输入错误信息，请问能否在cat1 cat2第一行的select都被选择非空的option的时候，禁用掉cow的validiton，也即是说即使第二行的cow的select选择value时空的option时也可以跳转，谢谢
$.fn.form_check = function (e) {
var e = e || window.event;
var page = $.mobile.activePage;
$('div.inner,input', page).removeClass('error');
$('p.errorMessage,div.errorBox', page).remove();
$('span', page).removeClass('admission').removeClass('invalid');
if (e && $(e.target).closest('a').hasClass('back')) {
return true;
}
var v = new Validator();
var valid1 = new validationObj({
validObj: v
});
valid1.cat1();
valid1.cat2();
if (cat1.value != '' && cat2.value != '') {//都不为空再执行验证，同时加上required property
$('#cow1,#cow2').prop('required',true)
valid1.cow1();
valid1.cow2();
}
else {//移除required property
$('#cow1,#cow2').prop('required', false)
}
return !v.has_errors();
};
该回答引用GPTᴼᴾᴱᴺᴬᴵ
可以使用以下代码禁用cow的validation：
cow1: function(){
var cat1Val = $('#cat1').val();
var cat2Val = $('#cat2').val();
if (cat1Val && cat2Val) {
this.validObj.challenge('cow1', 'cow1');
this.validObj.required();
}
},
cow2: function(){
var cat1Val = $('#cat1').val();
var cat2Val = $('#cat2').val();
if (cat1Val && cat2Val) {
this.validObj.challenge('cow2', 'cow2');
this.validObj.required();
}
},
在cow1和cow2的validation函数中，先获取cat1和cat2的value值，如果它们都不为空，则执行cow的validation。如果它们有一个为空，则不执行cow的validation，同时也不会触发required的错误信息。
可以使用条件语句来实现在cat1和cat2都有选择时，禁用cow的验证。
cat1: function(){
this.validObj.challenge('cat1', 'cat1') && this.validObj.required();
this.disableCowValidation();
},
cat2: function(){
this.validObj.challenge('cat2', 'cat2') && this.validObj.required();
this.disableCowValidation();
},
cow1: function(){
if (!this.isCowValidationDisabled()) {
this.validObj.challenge('cow1', 'cow1') && this.validObj.required();
}
},
cow2: function(){
if (!this.isCowValidationDisabled()) {
this.validObj.challenge('cow2', 'cow2') && this.validObj.required();
}
},
isCowValidationDisabled: function() {
return $('#cat1').val() && $('#cat2').val();
},
disableCowValidation: function() {
if (this.isCowValidationDisabled()) {
$('#cow1, #cow2').removeAttr('required');
} else {
$('#cow1, #cow2').attr('required', 'required');
}
},
在每个select的验证函数中，除了验证输入外，还调用了disableCowValidation方法。
disableCowValidation方法判断是否需要禁用cow的验证，如果需要，则移除cow的required属性；如果不需要，则添加required属性。
isCowValidationDisabled方法判断cat1和cat2是否都有选择非空的option，如果都选择了，则认为需要禁用cow的验证。
您好，我是有问必答小助手，您的问题已经有小伙伴帮您解答，感谢您对有问必答的支持与关注！