Question

我有一个multipage-site我加载外部页面html（框架执行ajax调用）。
加载页面后，我会执行一些我写的代码（如下）。
当我直接打开页面时，此代码工作正常，但如果我通过jquery导航到达页面，则无法正常工作。
有任何想法吗？感谢

function valorijson(cognome){
    var tennista;               
    for(var i=0; i<players.all.length; i++){
        tennista = players.all[i];
        console.log(tennista.cognome);
        if (cognome == tennista.cognome){
            $(".cognome").append(tennista.cognome);
        }
    }
}

$(document).ready(function () {
    $(function(){
            $(".trigger-tennista").on("click", "*", function(event){
                var cognome;
                cognome = $(event.target).closest(".trigger-tennista").attr("data-cognome");
                console.log(cognome); // ok fino qui
                $(".single-tennista-container").load("../single-player.html", function(){ // ok caricamento file
                    valorijson(cognome);
                });
        });
    });
});

更新
我改变了我的代码，它可以工作，但它不止一次！

$(document).on("pagecreate", function(){
        $(function(){
            $(".trigger-tennista").on("click", "*", function(event){
                alert("i");
              var cognome;
              cognome = $(event.target).closest(".trigger-tennista").attr("data-cognome");
              console.log(cognome); // ok fino qui
              $(".single-tennista-container").load("../single-player.html", function(){ // ok caricamento file
                valorijson(cognome);
              });
          });
        });
  });

更新2：部分工作代码

   $(document).on("pagecreate", "#splashpage", function(){
    var popup = $(".single-tennista-container");
    $(document).on("click", ".trigger-tennista", function(event){       
        var close = $(".close");
        var cognome;
        cognome = $(event.target).closest(".trigger-tennista").attr("data-cognome");
        popup.load("../single-player.html", function(){ // ok caricamento file
            valorijson(cognome);
            popup.removeClass("outsidepopup").addClass("insidepopup");

        });
        event.stopPropagation();
    });
    $(document).on("click", ".close", function(){
        popup.removeClass("insidepopup").addClass("outsidepopup");
    });
});

Answer 1

假设您在每个页面中都有类.trigger-tennista的DOM元素，您可以在创建第一个jQM页面时使用 event delegation 创建一次点击处理程序（更改{{ 1}}到你输入页面的实际id：）

initialpageid

通过这种方式，当您加载新页面时，单击处理程序将自动绑定到新的.trigger-tennista元素。

<强>更新

在审核评论中的代码时，我发现了两个问题：

您正在将1.2版javascript与1.4 css混合使用。选择一个版本的jQM，最好是1.4（或至少1.3）

在您设置的代码中

$(document).on("pagecreate", "#initialpageid", function(){
    $(document).on("click", ".trigger-tennista", function(event){
        var cognome;
        cognome = $(event.target).closest(".trigger-tennista").attr("data-cognome");
        console.log(cognome); // ok fino qui
        $(".single-tennista-container").load("../single-player.html", function(){ // ok caricamento file
            valorijson(cognome);
        });
        event.stopPropagation();
    });
});

在点击处理程序之外的

，因此当添加页面时，它可以在此类中找到多个DIV。而是在处理程序中获取正确的div：

var popup = $(".single-tennista-container");

在使用ajax加载页面后，在jquery mobile上执行代码

1 个答案: