如果语句只运行在脚本的一半

时间:2015-02-27 14:14:41

标签: javascript jquery

为什么我不能同时运行其中两个功能?有人必须遇到同样的问题。我想要完成的是自动完成(或预填充)的字段,因为其他字段我希望一旦这些框中有东西就删除错误验证。

例如:

您有一个带有邮寄地址的表单,一个标记物理与邮件相同的复选框以及物理地址字段。在填写任何内容之前,用户点击提交,这使得所有必填字段周围都有一个红色的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语句它会一直在列表中运行而不是中途停止。

1 个答案:

答案 0 :(得分:2)

所有代码都可以简化为



$(document).on('change blur', "input", function() {
    var isValid = this.value.length>0;
    $(this).valid(isValid);
});

/* Just to make example run */
jQuery.fn.extend({
  valid: function(isValid) { 
    return this.each(function() {
      var color = isValid ? "lime" : "pink";
      $(this).css("background-color", color);
    });
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" />
&#13;
&#13;
&#13;

问题是用户可以返回并更改文本,它将无效。