JQuery Mobile Linked Listview 无法正常工作？

Question

所以，我正在使用 JQuery Mobile 制作移动电子商务应用程序，但遇到了以下问题。

登录后，应用程序会将用户带到商店区域，该商店区域包含一个填充有 JSON 数据的链接列表视图。现在，当商店页面第一次初始化时，链接不起作用，但是当我刷新页面时，它们工作得很好。有谁知道我为什么会出现这种行为？

注意：我使用的是多页模板，从#store 页面导航到#product 页面。

这里是我为此使用的 javascript：

$(document).on("pagebeforecreate","#store", function() {
    getProducts('',
      function(data){
          let products = data.products;
          storeProducts(products);
          $(".product-list").html('');
          $.each(products, function(i, item){
            $(".product-list").append(`
              <li>
                <a href="#product" data-index="${item.prod_id}">
                  <img src="${item.picture}" alt="">
                  <h2>${item.prod_name}</h2>
                  <p>${item.prod_desc}</p>
                  <small>Price: <strong>€${item.unit_price}</strong></small>
                </a>
              </li>
              `).listview("refresh");
          });

        },
        function(e){
          console.log(e);
        },
        function(data){
          console.log('always');
      });
});

function getProducts(param, success, error, always){
  $.ajax({
    type:'GET',
    url:`./ajax/products-ajax.php?${param}`,
    dataType: 'json',
    async:true
  }).done(function(data){
    success(data);
  }).fail(function(e){
    error(e);
  }).always(function(data){
    always('always');
  });
}

提前致谢。

更新：

你好解封器， 再次感谢您的回答。控制台日志中没有显示任何错误。我尝试关闭浏览器中的缓存，但仍然有同样的问题。让我看看我是否可以更好地解释我正在尝试做的事情。

我正在尝试使用 JQuery Mobile 作为前端和 PHP 作为后端来制作这个应用程序。我有一个带有链接的 index.php，可以让您登录或注册。假设您选择登录选项，这将带您进入 login.php，其中有一个表单，当您提交它时，它会向服务器发出 ajax 请求以进行身份​​验证。假设响应成功，这会将您重定向到 listview 所在的 store.php。正如我之前所说，当您在登录后进入 store.php 时，列表视图中的链接不起作用，但是如果您刷新页面，则按预期工作。

Answer 1

这是导致问题的原因：

在身份验证后将用户重定向到 store.php 时，JQuery Mobile 的 Ajax 导航会抓取我在其中的第一页（store.php 是多页的，包含#store 和 #product）并将其注入到已经存在的页面之上在 DOM 中。当然，当我单击链接时，这些链接不起作用，因为 DOM 中没有 id = "product" 的页面容器。当我刷新页面时，JQuery mobile 向服务器发出了一个 http 请求，这次获取了包含 #store 和 #product 页面的完整 store.php，因此链接将按预期工作。

我的解决方案：将#store 和#product 作为外部页面。通过将它们分开并将它们称为外部页面，我避免了 Ajax 导航的这个问题。