最近做了一個(gè)基于文本框智能提示的效果，效果大致如下

當(dāng)我每輸入一個(gè)字符，通過ajax請(qǐng)求并返回匹配的結(jié)果。輸入第一個(gè)字符時(shí)，ajax的請(qǐng)求已經(jīng)開始，輸入第二字符時(shí)又一個(gè)ajax請(qǐng)求，這樣的話，用戶輸入十個(gè)字符就需要ajax請(qǐng)求十次，這里我需要一個(gè)特殊的要求，輸入第二個(gè)字符的時(shí)候把輸入第一個(gè)字符時(shí)的ajax請(qǐng)求中止或者取消(當(dāng)然前提是兩次輸入的時(shí)間間隔很短)，后一個(gè)ajax請(qǐng)求開始時(shí)把之前的一個(gè)ajax請(qǐng)求中止或取消。

var ajaxResult = null; jQuery("#Keywords").keyup(function () { jQuery(".SmartTips").hide(); if (jQuery(this).val() != "") { jQuery("#SmartTips li").children().remove(); var url = "/Product/SearchSmartTips.aspx"; var data = { keyword: jQuery(this).val(), randNum: getDateNum() }; if (ajaxResult != null) { ajaxResult.abort(); } ajaxResult = jQuery.get(url, data, function (redata) { jQuery("#SmartTips").children().remove(); redata = eval("(" + redata + ")"); if (redata.length > 0) { jQuery(".SmartTips").show(); } for (var i = 0; i < redata.length; i++) { jQuery("#SmartTips").append("<li οnclick=\"getKeyword('" + redata[i].Keyword + "'," + redata[i].Num + "," + redata[i].Pid + ");\" >" + redata[i].Keyword + "</li>"); } jQuery("#SmartTips").append("<li style=\"text-align:right;\" οnclick=\"closeSmartTips()\">Close</li>"); jQuery("#SmartTips li").hover(function () { jQuery(this).addClass("hover"); }, function () { jQuery(this).removeClass("hover"); }); }); } });

文本框中的輸入一字符，判斷ajaxResult這個(gè)XmlHttpRequest對(duì)象是否為null,不等于null就通過ajaxResult.abort();的abort()方法來中止請(qǐng)求。核心代碼如下

var ajaxResult = null; if (ajaxResult != null) { ajaxResult.abort(); } ajaxResult = jQuery.get(url, data, function (redata) { });

但是，IE7下,abort()方法有個(gè)bug.不支持abort()方法,會(huì)提示 “SCRIPT445: 對(duì)象不支持此操作 ”，使用jquery 1.42或者之下的版本都有這個(gè)問題，可以把jquery中的

try { var oldAbort = xhr.abort; xhr.abort = function() { if ( xhr) { oldAbort.call( xhr ); } onreadystatechange( "abort" ); }; } catch(e) { } //把jquery文件中上面部分的代碼替換成下面的代碼 try { var oldAbort = xhr.abort; xhr.abort = function() { if ( xhr) { if (oldAbort.call === undefined) { oldAbort(); } else { oldAbort.call( xhr ); } } onreadystatechange( "abort" ); }; } catch(e) { } 具體的更多解決方式討論請(qǐng)進(jìn)入http://forum.jquery.com/topic/object-doesn-t-support-this-property-or-method-from-jquery-1-4-1-in-ie7-only.

轉(zhuǎn)載于:https://www.cnblogs.com/yangbingqi/archive/2012/02/17/2355435.html

總結(jié)

以上是生活随笔為你收集整理的中止取消ajax请求,IE7下的bug解决的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。