9

嗨，我正在索引页面上加载几个 html 页面，具体取决于单击的链接。我对与单击事件处理程序相关的链接有问题。似乎在 jQuery 加载 html 文件后，该 html 中的链接没有有绑定到它们的点击事件处理程序。这是我的代码：

这是其中一个不起作用的链接的 html：

<a href="#" id="NavContactPage" data-sectionId="Skills">skills</a>

这是与之相关的jquery代码：

$("nav a , a.first_anchor , a#NavContactPage").click(function(){
    var id = $(this).attr("data-sectionId");
    var link = "load/" + id + ".html";

    $("div#Content").load(link , function(){
        $("section#" + id).fadeIn(); 
        if(id === "Portfolio"){
            $('div.slide').cycle('fade');
        }
        if(id === "Home"){
            $("#jcycleslider").cycle({
                fx: mtransition,
                easing: easing,
                before: onBefore,
                after: onAfter,
                speed: mpace,
                timeout: mnext,
                sync: msync,
                randomizeEffects:0,
                pager:'#jslider_nav'
            })
            $("#jslider_nav a").text("");
        }    
    })      
    return false;
})

我怎么解决这个问题？

4

4 回答 4

11

$("selector").click(...)仅将事件的回调注册click到在您进行查询时对 jQuery 可见的元素。因此，对于与此选择器匹配的新添加元素，将不会应用回调。

您要么需要再次将回调注册到新添加的元素，要么需要使用：

$(document).on('click',"nav a , a.first_anchor , a#NavContactPage", ... );

建议使用例如将内容加载到的元素作为根而不是使用文档作为根，例如$("div#Content").on( .... );

于 2013-01-15T14:05:52.450 回答
4

据我了解，您应该将委托与 .on() 一起使用：

$(document).on('click',"nav a , a.first_anchor , a#NavContactPage",function(){...}
于 2013-01-15T13:59:52.763 回答
3

当我使用 .load() 函数将 html 导入我的主页时遇到了这个问题。我把它放在我准备好的函数中，它对我有用

$(document).on('click','#btninsertrequest',function(){
alert("yes");
});
于 2016-03-05T22:51:33.080 回答
0

你在 jquery 上绑定你的事件准备好了吗？

您的事件绑定代码应该在里面并使用 on 而不是 click。我认为这应该可以解决您的问题。

$(function(){

  // Bind event here

});
于 2013-01-15T14:09:22.723 回答