jQuery ajaxがiOSで動作しない

Question

私たちのエンジニアの一人がiPadを私のところに持ってきて、私たちのサイトで機能しない機能を示しました。これはChromeとFirefoxで動作しますが、iPhoneやiPadでは動作しません。 3つの選択ボックスがあり、最初の値をクリックすると、ajaxが実行され、2番目の選択ボックスが表示されます。

これはiOSでは機能しない機能です。

私たちは、これをテストし始める場所が少し不足しています。誰かがこれをデバッグするためのアドバイスを提供することはできますか？代わりにclickイベントの<select>のchangeイベントに

$().ready(function() { 
     $('.vehicle-search .make').bind('click', function (e) { 
      var makeId = $(e.target).val(); 
      var container = $(e.target).parent('.vehicle-search'); 
      if (parseInt(makeId) > 0) { 
       $.ajax({ 
        url: site.internal.url + '/lib/ajax/vehicle/make/getModelList.php', 
        type: 'post', 
        dataType: 'json', 
        success: function (r) { 
         if (r.length > 0) { 
          $('.vehicle-search > .model').html(''); 
          $('.vehicle-search > .year').html(''); 

          var html = ''; 
          for (var i = 0; i < r.length; i++) { 
           html += "<option value='"+r[i].id+"'>"+r[i].name+"</option>"; 
          } 

          $('.vehicle-search > .model').html(html); 
         } else { 
          alert('We did not find any models for this make'); 
         } 
        }, 
        error: function() { 
         alert('Unable to process your request, ajax file not found'); 
         return false; 
        }, 
        data: { 
         makeId: makeId 
         } 
       }); 
      } else { 
       $('.vehicle-search > .model').html(''); 
       $('.vehicle-search > .year').html(''); 
      } 
     }); 
........ 

Answer 1

バインド。

また、iPad用にenable the Developer Consoleを使用すると、発生する可能性のあるJSエラーを確認できます。

将来的には、イベントハンドラ内のステートメントを健全性チェックとして入れて、呼び出されているかどうか、そしてどの時点でそれらが失敗しているかを判断する必要があるかどうかを確認してください。

Answer 2

私は何が間違っているのか分かりませんが、一般的に言えば、ここでは手軽にデバッグコンソールが付属しているモバイルサファリとIEでできることがあります。

1. alert()をコードに追加すると、少なくともスクリプトがいつ停止したかが分かります。
2. イベントハンドラはr以外の変数を受け取りません。success(r)です。ドックを調べると、あなたが調べることができる変数や、実際に起こっていることを助けることができるalert()という変数が見つかります。特にerror()ハンドラ。
3. compete()ハンドラは、ajaxが失敗したときに実行されます。変数をキャッチしてみてください。

Answer 3

問題はキャッシュです。このコード行を追加すれば、問題は解決されるはずです。

$.ajaxSetup({ cache: false });