IE7 / 8重復的AJAX請求

Question

在我寫的代碼上...

function change_regione(handle) {
// Hiding selects that we don't need
jQuery("select#comune").hide();
jQuery("select#quartiere").hide();
if(jQuery("#regione").val() == '') {
    jQuery("select#provincia").parent().hide();
    return
}

jQuery.ajax( {
    url : WEBSITE_PATH + 'loadProvince.php',
    type : 'GET',
    dataType: 'json',
    data : {
        search_value : jQuery("#regione option:selected").attr("rel")
    },
    success : function(result) {
        var provinceOptions = "<option value=\"\">Tutte le province</option>";
        jQuery.each(result,function(i,el){
            provinceOptions += '<option value="'+ el.url +'" rel="'+ el.id +'">' + el.value.replace("~","") + '</option>';
        }); 
        jQuery("select#provincia").parent().show();
        jQuery("select#provincia").html(provinceOptions).show();
    },
error : function(request, status, error) {
}
});

}

IE7 / 8在onchange（）事件上兩次啟動AJAX請求以進行選擇。

<select id="regione" name="regione" class="srhbox" onchange="change_regione(this)">
...
</select>

Firefox，Safari，Chrome瀏覽器運行正常。

這是怎么回事？ 您見過這種行為嗎？

Answer 1

好吧，我不確定為什么您在jQuery中使用內聯js。

只需使用jQuery的.change()事件：

$('#regione').change(function () {
    // Hiding selects that we don't need
    jQuery("select#comune").hide();
    jQuery("select#quartiere").hide();
    if (this.value == '') {
        jQuery("select#provincia").parent().hide();
        return;
    }

    jQuery.ajax({
        url: WEBSITE_PATH + 'loadProvince.php',
        type: 'GET',
        dataType: 'json',
        data: {
            search_value: jQuery("option:selected", this).attr("rel")
        },
        success: function (result) {
            var provinceOptions = "<option value=\"\">Tutte le province</option>";
            jQuery.each(result, function (i, el) {
                provinceOptions += '<option value="' + el.url + '" rel="' + el.id + '">' + el.value.replace("~", "") + '</option>';
            });
            jQuery("select#provincia").parent().show();
            jQuery("select#provincia").html(provinceOptions).show();
        },
        error: function (request, status, error) {}
    });
});

Answer 2

我不知道為什么會這樣，但是我可以為您解決。 嘗試這個。

var requestInProgress = false; // Variable to check if the request is in progress
function change_regione(handle) {

  if(requestInProgress){
     return;
  }

  requestInProgress = true;
  // Hiding selects that we don't need
  jQuery("select#comune").hide();
  jQuery("select#quartiere").hide();
  if(jQuery("#regione").val() == '') {
     jQuery("select#provincia").parent().hide();
     return
  }

  jQuery.ajax( {
      url : WEBSITE_PATH + 'loadProvince.php',
      type : 'GET',
      dataType: 'json',
      data : {
          search_value : jQuery("#regione option:selected").attr("rel")
      },
      success : function(result) {
          var provinceOptions = "<option value=\"\">Tutte le province</option>";
          jQuery.each(result,function(i,el){
              provinceOptions += '<option value="'+ el.url +'" rel="'+ el.id +'">' +   el.value.replace("~","") + '</option>';
          }); 
          jQuery("select#provincia").parent().show();
          jQuery("select#provincia").html(provinceOptions).show();
          requestInProgress = false;
      },
      error : function(request, status, error) {
      }
  });
}