Javascript If语句只在脚本中运行了一半
为什么我不能同时运行这两个函数?一定有人和我有同样的问题。我试图完成的是针对那些由于其他字段而自动完成(或预填充)的字段,一旦这些框中有内容,我希望删除错误验证 例如: 您有一个带有邮寄地址的表单、一个标记物理地址与邮寄地址相同的复选框以及物理地址字段。在用户点击submit填写任何内容之前,这会使所有必填字段周围都有一个红色css框。如果您输入了邮寄地址,红色框就会消失。然后点击复选框,它会在物理地址前加上前缀,但在您点击之前不会删除红色框。我希望在字段中填充内容后,无论是否预先填充,红色框都会消失。如果这对任何人都有意义,请发表评论Javascript If语句只在脚本中运行了一半,javascript,jquery,Javascript,Jquery,为什么我不能同时运行这两个函数?一定有人和我有同样的问题。我试图完成的是针对那些由于其他字段而自动完成(或预填充)的字段,一旦这些框中有内容,我希望删除错误验证 例如: 您有一个带有邮寄地址的表单、一个标记物理地址与邮寄地址相同的复选框以及物理地址字段。在用户点击submit填写任何内容之前,这会使所有必填字段周围都有一个红色css框。如果您输入了邮寄地址,红色框就会消失。然后点击复选框,它会在物理地址前加上前缀,但在您点击之前不会删除红色框。我希望在字段中填充内容后,无论是否预先填充,红色框都
$(document).on('change blur keyup mouseup ', function() {
if ($('#locality1').val() !== '') {
$('#locality1').valid();
}
if ($('#administrative_area_level_11').val() !== '') {
$('#administrative_area_level_11').valid();
}
if ($('#postal_code1').val() !== '') {
$('#postal_code1').valid();
}
if ($('#auto2complete1').val() !== '') {
$('#auto2complete1').valid();
}
if ($('#locality21').val() !== '') {
$('#locality21').valid();
}
if ($('#administrative_area_level_121').val() !== '') {
$('#administrative_area_level_121').valid();
}
if ($('#postal_code21').val() !== '') {
$('#postal_code21').valid();
}
if ($('#clocality1').val() !== '') {
$('#clocality1').valid();
}
if ($('#cadministrative_area_level_11').val() !== '') {
$('#cadministrative_area_level_11').valid();
}
if ($('#cpostal_code1').val() !== '') {
$('#cpostal_code1').valid();
}
if ($('#locality2').val() !== '') {
$('#locality2').valid();
}
if ($('#administrative_area_level_12').val() !== '') {
$('#administrative_area_level_12').valid();
}
if ($('#postal_code2').val() !== '') {
$('#postal_code2').valid();
}
if ($('#auto2complete2').val() !== '') {
$('#auto2complete2').valid();
}
if ($('#locality22').val() !== '') {
$('#locality22').valid();
}
if ($('#administrative_area_level_122').val() !== '') {
$('#administrative_area_level_122').valid();
}
if ($('#postal_code22').val() !== '') {
$('#postal_code22').valid();
}
if ($('#locality3').val() !== '') {
$('#locality3').valid();
}
if ($('#administrative_area_level_13').val() !== '') {
$('#administrative_area_level_13').valid();
}
if ($('#postal_code3').val() !== '') {
$('#postal_code3').valid();
}
if ($('#auto2complete3').val() !== '') {
$('#auto2complete3').valid();
}
if ($('#locality23').val() !== '') {
$('#locality23').valid();
}
if ($('#administrative_area_level_123').val() !== '') {
$('#administrative_area_level_123').valid();
}
if ($('#postal_code23').val() !== '') {
$('#postal_code23').valid();
}
if ($('#locality4').val() !== '') {
$('#locality4').valid();
}
if ($('#administrative_area_level_14').val() !== '') {
$('#administrative_area_level_14').valid();
}
if ($('#postal_code4').val() !== '') {
$('#postal_code4').valid();
}
if ($('#auto2complete4').val() !== '') {
$('#auto2complete4').valid();
}
if ($('#locality24').val() !== '') {
$('#locality24').valid();
}
if ($('#administrative_area_level_124').val() !== '') {
$('#administrative_area_level_124').valid();
}
if ($('#postal_code24').val() !== '') {
$('#postal_code24').valid();
}
if ($('#locality5').val() !== '') {
$('#locality5').valid();
}
if ($('#administrative_area_level_15').val() !== '') {
$('#administrative_area_level_15').valid();
}
if ($('#postal_code5').val() !== '') {
$('#postal_code5').valid();
}
if ($('#auto2complete5').val() !== '') {
$('#auto2complete5').valid();
}
if ($('#locality25').val() !== '') {
$('#locality25').valid();
}
if ($('#administrative_area_level_125').val() !== '') {
$('#administrative_area_level_125').valid();
}
if ($('#postal_code25').val() !== '') {
$('#postal_code25').valid();
}
});
$(document).on('change blur keyup mouseup ', function() {
if ($('#blocality1').val() !== '') {
$('#blocality1').valid();
}
if ($('#badministrative_area_level_11').val() !== '') {
$('#badministrative_area_level_11').valid();
}
if ($('#bpostal_code1').val() !== '') {
$('#bpostal_code1').valid();
}
if ($('#bauto2complete1').val() !== '') {
$('#bauto2complete1').valid();
}
if ($('#blocality21').val() !== '') {
$('#blocality21').valid();
}
if ($('#badministrative_area_level_121').val() !== '') {
$('#badministrative_area_level_121').valid();
}
if ($('#bpostal_code21').val() !== '') {
$('#bpostal_code21').valid();
}
if ($('#clocality1').val() !== '') {
$('#clocality1').valid();
}
if ($('#cadministrative_area_level_11').val() !== '') {
$('#cadministrative_area_level_11').valid();
}
if ($('#cpostal_code1').val() !== '') {
$('#cpostal_code1').valid();
}
if ($('#blocality2').val() !== '') {
$('#blocality2').valid();
}
if ($('#badministrative_area_level_12').val() !== '') {
$('#badministrative_area_level_12').valid();
}
if ($('#bpostal_code2').val() !== '') {
$('#bpostal_code2').valid();
}
if ($('#bauto2complete2').val() !== '') {
$('#bauto2complete2').valid();
}
if ($('#blocality22').val() !== '') {
$('#blocality22').valid();
}
if ($('#badministrative_area_level_122').val() !== '') {
$('#badministrative_area_level_122').valid();
}
if ($('#bpostal_code22').val() !== '') {
$('#bpostal_code22').valid();
}
if ($('#blocality3').val() !== '') {
$('#blocality3').valid();
}
if ($('#badministrative_area_level_13').val() !== '') {
$('#badministrative_area_level_13').valid();
}
if ($('#bpostal_code3').val() !== '') {
$('#bpostal_code3').valid();
}
if ($('#bauto2complete3').val() !== '') {
$('#bauto2complete3').valid();
}
if ($('#blocality23').val() !== '') {
$('#blocality23').valid();
}
if ($('#badministrative_area_level_123').val() !== '') {
$('#badministrative_area_level_123').valid();
}
if ($('#bpostal_code23').val() !== '') {
$('#bpostal_code23').valid();
}
if ($('#blocality4').val() !== '') {
$('#blocality4').valid();
}
if ($('#badministrative_area_level_14').val() !== '') {
$('#badministrative_area_level_14').valid();
}
if ($('#bpostal_code4').val() !== '') {
$('#bpostal_code4').valid();
}
if ($('#bauto2complete4').val() !== '') {
$('#bauto2complete4').valid();
}
if ($('#blocality24').val() !== '') {
$('#blocality24').valid();
}
if ($('#badministrative_area_level_124').val() !== '') {
$('#badministrative_area_level_124').valid();
}
if ($('#bpostal_code24').val() !== '') {
$('#bpostal_code24').valid();
}
if ($('#blocality5').val() !== '') {
$('#blocality5').valid();
}
if ($('#badministrative_area_level_15').val() !== '') {
$('#badministrative_area_level_15').valid();
}
if ($('#bpostal_code5').val() !== '') {
$('#bpostal_code5').valid();
}
if ($('#bauto2complete5').val() !== '') {
$('#bauto2complete5').valid();
}
if ($('#blocality25').val() !== '') {
$('#blocality25').valid();
}
if ($('#badministrative_area_level_125').val() !== '') {
$('#badministrative_area_level_125').valid();
}
if ($('#bpostal_code25').val() !== '') {
$('#bpostal_code25').valid();
}
});
我还尝试将它们组合起来,并将下半部分与上半部分相加,但它只运行脚本的上半部分。如果我切换它,并且确实先启动下半部分,那么只有那部分起作用。有人能告诉我这是什么原因吗?我认为如果使用if语句,它将一直运行到列表中,而不会中途停止。所有这些代码都可以简化为
$(文档).on('change blur','input',function()){
var isValid=this.value.length>0;
$(this).valid(isValid);
});
/*只是为了让示例运行*/
jQuery.fn.extend({
有效:函数(isValid){
返回此值。每个(函数(){
var color=isValid?“石灰”:“粉色”;
$(this.css(“背景色”,color);
});
}
});代码>
您可以通过为所有字段提供相同的类来稍微优化代码:$('.field')。每个(function(){if($(this.val())$(this.valid())$(this.valid()})
。您可以将整个代码精简为5行,完全避免ifs。复制和粘贴太多了!使用验证库或HTML5验证。元素可以有多个类。添加像这样的公共类
。然后使用我第一条评论中的代码。我最好使用:input
也包括文本区域、选择框等如果(this.value.length){/*valid code*/}其他{/*invalid code here*/}
errrr Iv尝试了所有这些,但仍然没有做我正在尝试的事情。我能解释一下我在做什么吗?@Vicki,上面的代码非常干净,编写得很好,但是您需要注意,通过使用上面的代码,它将在加载此脚本的页面上的每个输入字段上应用此“长度”验证。您可能想要,也可能不想要,所以请注意这一点。这不是我上面为jquery所做的吗?