Question

我在链接中使用url变量来传递唯一ID，该ID通过ajax运行并使用.html()注入。参见下面的代码

我添加了一个超时，在填充前将empty()添加到了div，

链接到页面：

<a href="member.html?id=' + member.id + '" data-role="none" data-transition="slide">

页面创建：

$(document).on( "pageshow", "#member-page", function(event) {
   .....
   var request = $.ajax({
      url: serviceURL + 'member_profile',
      method: "GET",
      data: { id : id },
      dataType: "html"
   });
   request.done(function( data ) {
      ...
      alert(html);
      $('#member-profile').hide().empty().html(html).fadeIn();
    });


    request.fail(function( jqXHR, textStatus, errorThrown ) {
       alert( "Request failed Line 752: " + textStatus + " - " + jqXHR.responseText);
       $.mobile.loading( "hide" );
    });
});

有时它可以工作，有时却不能。即使alert(html)始终显示数据。

是否有更好的方法来传递ID和呈现页面，例如使用pagebeforecreate

Answer 1

您错过了向我们展示代码中最重要的部分的过程。如果还包括$ .ajax部分，那么分析代码会容易得多。

我会假定两个可能的解决方案，而且我认为这两种解决方案在您的案例中都交织在一起。

Ajax进程本质上是异步的，这意味着其余代码不会等待它完成。这可能是为什么有时看不到新内容的原因。可能与AJAX调用的速度有关。

您是否尝试过这样做：

$.ajax({
  url: "YOUR ENDPOINT"
}).done(function(html) {
  $('#member-profile').hide().empty().html(html).fadeIn();
});

通过这种方式，只有在实际接收到内容时，才会清理/填充内容。

第二种可能性是pageshow事件本身。取决于其速度，jQuery Mobile可能没有时间来预渲染新的HTML内容并显示它。如果是这种情况，最好使用pagebeforecreate或pagecreate事件。如果您使用的是旧版jQuery Mobile事件，则使用pageinit。

在jquery-mobile中使用ajax数据填充页面并不总是有效

1 个答案: