jQuery Ajax 在 iOS 中不起作用（使用 list.js）答案

【问题标题】：jQuery Ajax not working in iOS (with list.js)jQuery Ajax 在 iOS 中不起作用（使用 list.js）
【发布时间】：2016-08-01 18:09:47
【问题描述】：

发现我们网站上无法使用的功能 - 仅适用于 iOS 设备（iPad、iPhone）。

我们使用list.js 根据输入的内容对目录进行实时过滤。还有两个选择字段允许基于分类进行过滤。这些工作正常。

实时过滤功能适用于 Chrome、Firefox、Safari、IE 和 Android。我不确定下一步该去哪里进行调试，因为我们做了以下无济于事：

已检查以确保没有大写/小写文件名和/或路径会导致 iOS 出错。
在 ajax 代码中添加了一个 console.log，以确保它在 iOS 上触发（它是；由 Web Inspector 通过 Safari 验证）。
通过 Web Inspector 检查错误或警告（无错误、无警告、无）。

这是我们 main.js 文件中的代码：

    var listingsArray;

    $.ajax({
        url: php_ajax_url,
        type: "POST",
        data: "action=sackville_directory_feed",
        async: false,
        success: function(results) {
            var listings = JSON.parse(results);
            listingsArray = $.map(listings, function(el) { 
              return el; 
            });
        },
        error: function() {
            console.log('Cannot retrieve data.');
        }
    });

    var directory = {};
    var directoryListings = $('.list');

    directory.renderHTML = function(z, listing){
      directoryListings.append('<div class="card card-directory col-lg-3 col-md-4 col-sm-6"><div class="directory-image" style="background-image: url(' + listing.image + ')"></div><h3 class="name">' + listing.name + '</h3><p class="description">' + listing.description + '</p><span>' + ( listing.address !== '' ? listing.address + ', ' : '') + ( listing.city_province !== '' ? listing.city_province : '') + ( listing.postal !== '' ? ', ' + listing.postal : '' ) + '</span><span>' + listing.phone + (listing.website !== '' ? ' | <a href="' + listing.website +  '">Visit Website</a>' : '') + '</span></div>');
    };

    directory.init = function(){
      directoryListings.empty();
      $.each(listingsArray, function(i, listing){
        directory.renderHTML(i, listing);
      });
    }; 

    $('.directory-filters').on('change', function(){
      var option = $(this).val();
      var label = $(this).find('option:selected').text();
      directoryListings.empty();

      if(option === 'all'){
        directory.init();
      }

      $.each(listingsArray, function(i, listing){
        if(listing.hasOwnProperty('category') && listing.category.indexOf(option) >= 0){ /* If category filter is contained within listing data */
          directory.renderHTML(i, listing);
        } else if(listing.hasOwnProperty('theme') && listing.theme.indexOf(option) >= 0){ /* If theme filter is contained within listing data */
          directory.renderHTML(i, listing);
        }
      });

      $('#current-results').html(label);
    });

    /* Get it started */
    directory.init();

    /* List JS live search */
    directory.options = {
      valueNames: [ 'name', 'description', 'category' ]
    };

    directory.directoryList = new List('directory', directory.options);

  }

这是一个使用Sage starter theme的WordPress网站，上面的php_ajax_url位在functions.php中引用了以下内容：

function assets() {
    wp_enqueue_style('sage/css', Assets\asset_path('styles/main.css'), false, null);

    $ajax_url = admin_url( 'admin-ajax.php' );

    wp_enqueue_script('sage/js', Assets\asset_path('scripts/main.js'), ['jquery'], null, true);
    wp_localize_script( 'sage/js', 'php_ajax_url', $ajax_url );
    }
    add_action('wp_enqueue_scripts', __NAMESPACE__ . '\\assets', 100);

我是 Ajax 的新手，希望能得到一些关于下一步该做什么的指导。或者，你有什么明显的错误吗？

【问题讨论】：

尝试在您的 url 中使用相对路径而不是绝对路径。
布鲁诺：你能澄清一下我在哪里可以做到吗？谢谢！
Bruno 指的是资产函数中的 admin_url 函数。 admin_url 返回一个非相对的绝对路径。我不确定这是否能解决您的问题，但这是他建议您尝试的方法。
您有可以分享的相关网站的网址吗？
它根本不起作用还是只在某个时候起作用？一个疑问是多个 AJAX 调用，因为您没有取消以前运行的 AJAX。 iOS Safari 一次只允许一个 HTTP 连接。

标签： jquery ios ajax wordpress

【解决方案1】：

也许这是一个很长的机会，因为我无法重现该错误，但正如我所见，当您的网站在 HTTP 上运行时，您的 admin-ajax.php 网址在 HTTPS 下。

试试这个：

$ajax_url = admin_url( 'admin-ajax.php', 'http' );

【讨论】：