Trình xử lý sự kiện nhấp chuột jQuery không hoạt động sau khi tải trang html có tải()

Question

Xin chào Tôi đang tải một số trang html trên trang chỉ mục tùy thuộc vào liên kết nào đã được nhấp. Tôi gặp sự cố với các liên kết đã xử lý sự kiện nhấp chuột cố định Có vẻ như sau khi jQuery tải các tập tin html các liên kết trong html đó không có xử lý sự kiện bấm có ràng buộc với họ. Đây là mã của tôi:

Đây là html cho một trong các liên kết mà không làm việc:

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

Đây là mã jquery asocieted với nó:

$("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; 
}) 

Làm thế nào tôi có thể giải quyết vấn đề?

Answer 1

$("selector").click(...) chỉ đăng ký các callbacks cho sự kiện click đến các yếu tố mà trong đó có thể nhìn thấy jQuery tại thời điểm bạn đã truy vấn . Vì vậy, đối với các phần tử mới được thêm vào, khớp với công cụ chọn này, hàm gọi lại sẽ không được áp dụng.

Bạn có thể cần phải registrate callbacks đến các yếu tố mới được thêm một lần nữa hoặc bạn cần phải sử dụng:

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

Thay vì sử dụng tài liệu như là người chủ nó được đề nghị để sử dụng ví dụ yếu tố mà bạn đang tải nội dung vào dưới dạng gốc, ví dụ: $("div#Content").on(....);

Answer 2

Như tôi hiểu nó, bạn nên sử dụng đoàn với .Trên():

$(document).on('click',"nav a , a.first_anchor , a#NavContactPage",function(){...} 

Answer 3

Các sự kiện liên quan đến ur có sẵn trên jquery chưa?

Mã ràng buộc sự kiện của bạn phải ở trong và sử dụng thay vì nhấp chuột. Tôi nghĩ rằng nên giải quyết vấn đề ur.

$(function(){ 

    // Bind event here 

}); 

Answer 4

gặp phải vấn đề này khi tôi đang sử dụng hàm .load() để nhập html vào trang chính của tôi. Tôi đặt chức năng này vào bên trong chức năng sẵn sàng của tôi và nó hoạt động cho tôi

$(document).on('click','#btninsertrequest',function(){ 
alert("yes"); 
});