1

我正在构建一个 AJAX 函数，它可以调用scroll或click/touchtstart将一些内容附加到我的 HTML。在桌面环境中，点击和滚动事件对我来说一切都很好。但是，它们都不适用于我的 Android 2.3.7 HTC EVO 或我的 Android 4.1.1 上的 Nexus 7。

这是我的点击 JavaScript 事件处理程序：

$('.loadMore').each(function() {

  //Set URL and start on the first page
  var self = this;
  var path2root = ".";
  var loc = window.location.origin;
  var url = loc + "/process.php";
  var subcategoryId = $(this).parent().attr('data-subcategoryId');
  var page = 1;

  // Build the updated URL
  $(self).bind('touchstart', function(e) {
    e.preventDefault();

    page++;

    // AJAX function for processing JSON
    $.ajax({
      url: url + "?subcategoryId=" + subcategoryId + "&page=" + page,
      type: "GET",
      contentType: "application/json; charset=utf-8",
      dataType: "json",
      async: false,
      success: function (data) {
        var i = 0;
        for(i = 0 ; i < data.length; i++) {
          var articleId = data[i].articleResult.articleId;
          var title = data[i].articleResult.title;
          var subhead = data[i].articleResult.subhead;
          var image = data[i].articleResult.image;
          var response = "<td><div class='articleResult'><a href='" + path2root + "/article/article.php?articleId=" + articleId + "'><img src='" + image + "' width='120'/></a><br><h3><a href='" + path2root + "/article/article.php?articleId=" + articleId + "'>" + title.substring(0,25) + "</a></h3></div></td>";
          $("table tr td:nth-last-child(2)").after(response);
        };
      }
    });
  });
});

我的滚动功能非常相似，只是我将事件绑定到不同的元素，并且在滚动时：

// Collecting scroll info
    $('.overthrow').each(function() {

     // SAME VARIABLES

      $(this).scroll(function () { 
        if ($(self).scrollLeft() >= parseInt($(document).width() - 50)) {    
            if (finished == 1) {
              page++;
              finished = 0;

              // SAME AJAX FUNCTION

            };
          };
      });
    });

请记住，这是一个针对移动设备优化的网页，而不是本机 PhoneGap 应用程序，而且我使用的是常规 jQuery 1.8.0，而不是 jQuery Mobile 或 PhoneGap。

我在 Google Code 上发现了关于 Android 2.3 没有非常有效地接收 touchstart 事件的这个问题，这导致我开始构建 on scroll 功能。

4

2 回答 2

1

根据您来自Google Code的链接，解决方法是e.preventDefault()在您的活动开始时包含一个，touchstart如下所示：

$(self).bind('touchstart', function(e) { // include e as a reference to the event
    e.preventDefault(); // prevents the default behaviour on this element
    ....
});

以上适用于我的 Android 2.X 设备；我希望它有帮助！

于 2012-09-24T17:08:27.017 回答
0

所以我能够让 AJAX 调用在滚动事件中正常运行。我已经click/touchstart一起放弃了这个活动，因为这在 Android 中似乎有问题。

无论出于何种原因，Android 在上传到网络服务器时都没有正确读取动态 URL：

var loc = window.location.origin;
var url = loc + "/process.php";

因此，当我使用编译后的 URL 构建我的 ajax 调用时：

$.ajax({
  url: url + "?subcategoryId=" + subcategoryId + "&page=" + page,

window.origin.location被误解了。相反，我需要对process.php文件的位置进行硬编码：

url: "process.php?subcategoryId=" + subcategoryId + "&page=" + page,

我通过另一个 SO 帖子在这里发现了我的解决方案

唯一的问题是我的代码可以在 iPhone 上运行，但不能在 Android 上运行。如果有人知道这背后的原因，那将是很好的信息。

于 2012-09-24T21:09:47.547 回答