2012-03-22 55 views
0

我正在触发组合框上的多个值的更改事件,但不幸的是事件正在丢失。是否有办法在触发下一个事件之前等待一个事件完成。示例代码如下所示在循环中触发更改事件会导致丢失事件

 for (i = 0; i < contextFilters.length; i++) 
     { 
      var contextFilter = contextFilters[i]; 
      if (contextFilter != "") 
      { 
       var cfData = contextFilter.split(":"); 
       var cfName = cfData[0]; 
       var cfVal = cfData[1]; 
       if (cfName != null) 
       { 
        //alert("cfName : " + cfName); 
        //alert("cfVal : " + cfVal); 
        $('#context_filter').val(cfName); 
        $('#context_filter').trigger('change', cfVal);       
       } 
      } 
     } 

当事件触发一个新的选择框被添加到DOM,但越来越添加并非所有的选择框。

而且变化的事件处理程序是S-图所示

$('#context_filter').change(function(event, selectValues) 
{ 
    if ($(this).prop("selectedIndex") > 0) 
    { 
     populateDateValues(); 
     var contextFilterComboObject = $(this); 
     var selectedVal = $(contextFilterComboObject).val(); 
     var validate = $('#collapsiblePanel :input').attr('disabled') == null; 
     if (!validate) 
     { 
      $('table[id*=OtherOptions] :input').attr('disabled', false); 
      $('#collapsiblePanel :input').attr('disabled', false); 
     } 
     var formInput = decodeURIComponent($('#rptInputParams').serialize()); 
     formInput += "&validate=" + validate; 
     $('#ajaxBusy').show(); 
     $.getJSON('GetContextFilterData', formInput, function(data) 
     { 
      var selectBox = '<tr><td class="celltoppad"><b>' + selectedVal + 
        ' : </b></td> <td class="celltoppad"><select multiple="multiple" name="' + 
        selectedVal.toLowerCase() + '" id="' + selectedVal.toLowerCase() + '" >'; 
      var errorMsg = ''; 
      var errorCount = 1; 
      errorMsg += '<html>'; 
      $.each(data.errorMessageList, function(index, value) 
      { 
       errorMsg += errorCount + ') ' + value + '</br></br>'; 
       errorCount++; 
      }); 
      errorMsg += '</html>'; 

      if (errorCount > 1) 
      { 
       $('#ajaxBusy').hide(); 
       showErrorDialog(errorMsg, errorCount * 20); 
       $(contextFilterComboObject).prop("selectedIndex", '0'); 
       return; 
      } 

      $.each(data.contextFilterDataList, function(index, value) 
      { 
       selectBox += '<option value="' + value + '">' + value + "</option>"; 
      }); 

      selectBox += 
        '</select></td><td class="celltoppad"><a href="#"><img id="removeCF" ' + 
          'src="../images/remove.png"/></a></td></tr>'; 

      $('#ajaxBusy').hide(); 
      // If the context filter has not been already added. 
      if ($('#' + selectedVal.toLowerCase()).length == 0) 
      { 
       $('a[id*=_showDialog]').hide(); 
       toggleDatePickerLink(); 
       $('img#removeDate').hide(); 
       $('table[id*=OtherOptions] :input').attr('disabled', true); 
       $('#collapsiblePanel :input').attr('disabled', true); 
       $('table#context_filter').append(selectBox);      
       $(contextFilterComboObject).prop("selectedIndex", '0'); 
      } 

      if (selectValues != null) 
      { 
       $('#' + selectedVal.toLowerCase()).val(selectValues.split(",")); 
      } 

      $('#' + selectedVal.toLowerCase()).multiselect({ 
       noneSelectedText: 'Please select', 
       selectedList: 3, 
       selectedText: '# of # selected', 
       position: { 
        my: 'left center', 
        at: 'right center', 
        offset: '20 100' 
       } 
      }).multiselectfilter(); 
     }); 
    } 
}); 
+0

可以提供'change'事件处理 – mgraph 2012-03-22 13:49:54

+0

请参阅我已经添加了更改事件处理程序。 – gags 2012-03-23 05:08:59

回答

0

我能够找出解决我的问题的方法,点击后退按钮并触发更改事件,然后我使用async作为ajax调用,并解决了问题。这是因为如果异步是真实的,则json调用同时发生,并且在此期间某些事件丢失。

感谢

0

,而不是触发事件,你就不能调用处理程序?

var handler = function(event, selectValues) 
{ 
    if ($('#context_filter').prop("selectedIndex") > 0) 
    { 
     populateDateValues(); 
     var contextFilterComboObject = $('#context_filter'); 
     var selectedVal = $(contextFilterComboObject).val(); 
     var validate = $('#collapsiblePanel :input').attr('disabled') == null; 
    if (!validate) 
    { 
     $('table[id*=OtherOptions] :input').attr('disabled', false); 
     $('#collapsiblePanel :input').attr('disabled', false); 
    } 
    var formInput = decodeURIComponent($('#rptInputParams').serialize()); 
    formInput += "&validate=" + validate; 
    $('#ajaxBusy').show(); 
    $.getJSON('GetContextFilterData', formInput, function(data) 
    { 
     var selectBox = '<tr><td class="celltoppad"><b>' + selectedVal + 
       ' : </b></td> <td class="celltoppad"><select multiple="multiple" name="' + 
       selectedVal.toLowerCase() + '" id="' + selectedVal.toLowerCase() + '" >'; 
     var errorMsg = ''; 
     var errorCount = 1; 
     errorMsg += '<html>'; 
     $.each(data.errorMessageList, function(index, value) 
     { 
      errorMsg += errorCount + ') ' + value + '</br></br>'; 
      errorCount++; 
     }); 
     errorMsg += '</html>'; 

     if (errorCount > 1) 
     { 
      $('#ajaxBusy').hide(); 
      showErrorDialog(errorMsg, errorCount * 20); 
      $(contextFilterComboObject).prop("selectedIndex", '0'); 
      return; 
     } 

     $.each(data.contextFilterDataList, function(index, value) 
     { 
      selectBox += '<option value="' + value + '">' + value + "</option>"; 
     }); 

     selectBox += 
       '</select></td><td class="celltoppad"><a href="#"><img id="removeCF" ' + 
         'src="../images/remove.png"/></a></td></tr>'; 

     $('#ajaxBusy').hide(); 
     // If the context filter has not been already added. 
     if ($('#' + selectedVal.toLowerCase()).length == 0) 
     { 
      $('a[id*=_showDialog]').hide(); 
      toggleDatePickerLink(); 
      $('img#removeDate').hide(); 
      $('table[id*=OtherOptions] :input').attr('disabled', true); 
      $('#collapsiblePanel :input').attr('disabled', true); 
      $('table#context_filter').append(selectBox);      
      $(contextFilterComboObject).prop("selectedIndex", '0'); 
     } 

     if (selectValues != null) 
     { 
      $('#' + selectedVal.toLowerCase()).val(selectValues.split(",")); 
     } 

     $('#' + selectedVal.toLowerCase()).multiselect({ 
      noneSelectedText: 'Please select', 
      selectedList: 3, 
      selectedText: '# of # selected', 
      position: { 
       my: 'left center', 
       at: 'right center', 
       offset: '20 100' 
      } 
     }).multiselectfilter(); 
    }); 
} 
}); 

    for (i = 0; i < contextFilters.length; i++) 
    { 
     var contextFilter = contextFilters[i]; 
     if (contextFilter != "") 
     { 
      var cfData = contextFilter.split(":"); 
      var cfName = cfData[0]; 
      var cfVal = cfData[1]; 
      if (cfName != null) 
      { 
       //alert("cfName : " + cfName); 
       //alert("cfVal : " + cfVal); 
       $('#context_filter').val(cfName); 
     handler(null, cfVal);      
      } 
     } 
    } 

我上面的代码中从来没有测试过,但我宣布你的处理程序作为一个函数,然后在底部循环中,你可以看到我怎么称呼它,而不是触发它的(处理器(cfVal))

+0

我的更改事件处理程序如上所示,我怎样才能调用上述处理程序而不是触发事件? – gags 2012-03-23 05:10:02

+0

嗨汤姆, 感谢您的解释,但行为仍然与事件相同,即说如果有四个调用处理程序,其中只有2或3个调用成功实现,其余的都像事件一样丢失。如果我把alert放在处理函数中,它可以很好地工作。所以,不知何故这些电话会被吃掉,有没有解决方案? – gags 2012-03-26 05:37:17

+0

我很抱歉,我aùnp jquery专家,我想你必须调试它或重写它才能使其工作。 – Tom 2012-03-26 05:58:48