jquery mobile：未捕获的TypeError：无法读取ajax调用中未定义错误的属性“中止”答案

【问题标题】：jquery mobile : Uncaught TypeError: Cannot read property 'abort' of undefined error in ajax calljquery mobile：未捕获的TypeError：无法读取ajax调用中未定义错误的属性“中止”
【发布时间】：2014-06-30 07:28:35
【问题描述】：

你好，我用 jquery mobile 建立了一个网站，我正在使用 jquery mobile 的自动完成我想中止以前的 ajax 请求，但我面临Cannot read property 'abort' of undefined 的错误这是我的代码：

<div id="myPage">  
  <ul id="autocomplete" data-role="listview" data-inset="true" data-filter="true" data-filter-placeholder="Find a city..." data-filter-theme="a"></ul>                  
</div>

这里是js代码：

<script type="text/javascript">
   var xhr ;
   $(document).on( "pageinit", function() {
       autoComplete();
   });
   function autoComplete(){ 
$( ".ui-input-text" ).on( "keyup", function ( e, data ) {   
       var $ul = $('#autocomplete'),
           $input = $(this),
           value = $input.val(),
           html = "";
    $ul.html( "" );
    if ( value && value.length > 1 ) {
        $ul.html( "<li><div class='ui-loader'><span class='ui-icon ui-icon-loading'></span></div></li>" );
        $ul.listview( "refresh" );
        console.log(xhr);
        if(xhr && xhr.readystate != 4 &&  typeof xhr !== 'undefined'){
            xhr.abort();
        }

        xhr = $.ajax({
            url: "http://gd.geobytes.com/AutoCompleteCity",
            type:'POST',
            dataType: "jsonp",
            data: {
                 q: $input.val(),
            }
       })
       .then( function ( response ) {
            $ul.html( response );
            $ul.listview( "refresh" );
            $ul.trigger( "updatelayout");               
       });      
     }
  });   
}
</script>

这里是DEMO 链接：http://dev.artoonsolutions.com/jignesh/mobile_auto/index.html

【问题讨论】：

this.xhr.abort(); 到 xhr.abort();。
xhr.abort();它也是创建和错误：Uncaught TypeError: undefined is not a function @Omar
.abort() 是一个函数吗？
一点也不：.abort() 不是函数。这是方法@Omar
解决方案在这里：stackoverflow.com/questions/20159017/…

标签： javascript jquery html ajax jquery-mobile

【解决方案1】：

需要对你的函数进行一些修改，用这个替换你的函数：-

function autoComplete(){    
   $( ".ui-input-text" ).on( "keyup", function ( e, data ) {    
       var $ul = $('#autocomplete'),
       $input = $(this),
       value = $input.val(),
       html = "";

       $ul.html( "" );
       if ( value && value.length > 1 ) {
       $ul.html( "<li><div class='ui-loader'><span class='ui-icon ui-icon-loading'>/span></div></li>" );
       $ul.listview( "refresh" );
       if(xhr && xhr.readystate != 4){
           xhr.abort(); 
       }
       xhr = $.ajax({
           url: site_url+"jewels/GetLeftPanel",
           type:'POST',             
           data: {
               Type: $('#btn_jtype').val(),
               Group: $('#btn_gid').val(),
               tagValue: $('#btn_tag_select').val(),
               Searching: $input.val(),
           },
           success: function(response){
            $ul.html( response );
            $ul.listview( "refresh" );
            $ul.trigger( "updatelayout");
       }
       });                    
    }
 });    
}

【讨论】：