0

好的,有这样的问题......我正在尝试减少验证字段所需的代码量。在这种情况下,我创建了包含要绑定事件的元素的 id 的数组。像这样:

var fields = new Array('#edit-field-first-name', '#edit-field-last-name', '#edit-field-mobile');

然后我在一个循环中绑定事件:

for(var i = 0; i < fields.length; i++){
  if($('#user-profile-form ' + fields[i]).length > 0){
    var $obj = $('#user-profile-form ' + fields[i]);
    $obj.bind({
      blur :  function(){
                  if(!reg_chars.test($obj.val())){
                      $obj.css('border','1px solid #A14')
                          .parent().children('div.description').css('color', '#A14');
                  }else{
                      $obj.css('border-style','solid').css('border-color','#C5C3C3 #EDEDED #EDEDED #C5C3C3').css('border-width','1px')
                         .parent().children('div.description').css('color', '#333');
                  };
              }
    })
  }
}

现在奇怪的事情发生了。它正在正确触发“模糊”事件。但它总是引用数组中的最后一个元素。看起来它总是使用相同的对象,并且每次循环迭代都覆盖它。

所以需要帮助......有什么可以解决的?

4

2 回答 2

2

绑定函数中的上下文 ($obj) 赋值问题。尝试更改为

    for(var i = 0; i < fields.length; i++){
      if($('#user-profile-form ' + fields[i]).length > 0){
        var $obj = $('#user-profile-form ' + fields[i]);
        $obj.bind({
          blur :  function(){
                      var $input = $(this);                      

                      if(!reg_chars.test($input.val())){
                          $input.css('border','1px solid #A14')
                              .parent().children('div.description').css('color', '#A14');
                      }else{
                          $input.css('border-style','solid').css('border-color','#C5C3C3 #EDEDED #EDEDED #C5C3C3').css('border-width','1px')
                             .parent().children('div.description').css('color', '#333');
                      };
                  }
        })
      }
    }
于 2012-08-30T05:17:51.153 回答
0

我建议花时间阅读 John Resig 的教程Learning Advanced Javascript。它将帮助您解决这个问题,也将使您对 Javascript 有更深入的了解。

于 2012-08-30T05:12:56.603 回答