2014-07-24 15 views
7

Tôi hiện đang sử dụng http://instantclick.io, tuy nhiên plugin không ràng buộc các liên kết được tạo động của tôi.InstantClick không ràng buộc với dynamic href

PHP đáp ứng

$json['alert'] = array(
     'type'  => 'success', 
     'content' => 'Success! Your new thread has been posted, you can visit  it <a href="' . site_url_in . 'forums/thread/' . $id . '">here</a>' 
); 

xử lý hình thức jQuery

$.post(url, form, function(data){ 
      //Lets do awesomeness 
      console.log('Data: ' + data); 
      console.log('Form: ' + form); 
      dm.commander.init(data); 
     }); 

Commander.init đọc trong phản ứng, và các phản ứng trên sẽ thực hiện chức năng trong alert()dm.commander

alert: function(message) 
{ 
    $("#messages").empty(); 
    $("#messages").prepend('<div class="alert alert-'+message['type']+'">'+message['content']+'</div>'); 
//  this.scrollTo('messages'); 

}, 

Như bạn có thể thấy phản hồi PHP gửi đi một cảnh báo với một liên kết trong đó. Các hình thức sau đó sẽ xử lý nó và trả về alert() mà prepends một div để #messages

Và jQuery rằng liên kết là

$(document).one('click', 'a', function(e) { 
     console.log('clicked'); 
     e.preventDefault(); 
    }) 
    InstantClick.init(100); 

Các công trình trên với các liên kết bình thường đã có trên trang tuy nhiên nó doesn' t làm việc với liên kết mà PHP tạo và các phần mở rộng của jQuery.

Mặc dù tôi không thể ủy quyền cụ thể cho #messages do các chức năng khác trong tương lai có thể thêm vào để nói #content.

Có cách nào để ràng buộc instantclick với các liên kết được tạo động như trên.

Và có, tôi đã nghiên cứu và không thể tìm thấy câu trả lời phù hợp.

+0

Bạn đang gọi instantclick sau những chức năng? – NathanG

+0

Instantclick là điều cuối cùng được bắt đầu, tôi cũng đã thử khởi động lại sau khi quá trình biểu mẫu không có kết quả – Ian

+0

Rất tiếc, đó là điều duy nhất tôi có thể nghĩ đến ngay bây giờ. – NathanG

Trả lời

4

Bạn chỉ đang khởi chạy tải trên trang InstantClick. Sau đó nó sẽ tự áp dụng trên tất cả các liên kết hiện có trong cây DOM. Sau đó, khi bạn thêm các liên kết mới vào cây DOM, các liên kết này không được thêm tự động vào InstantClick. Hãy thử khởi tạo InstantClick ở cuối chức năng cảnh báo AJAX.

Sau khi đọc câu trả lời của NoGray, tôi nghĩ bạn muốn thay đổi từ .one thành .on. Ngoài ra, điều này cũng cần được bắt đầu lại:

Tôi phải thừa nhận điều này có vẻ hơi bẩn. Chỉ cần khởi tạo lại nó, nhưng tôi không thể tìm thấy bất kỳ tài liệu về một số loại tiêu diệt hoặc chức năng reinit. Vì vậy, đây là dự đoán tốt nhất của tôi.

Mã dưới gốc cố định:

$(document).on('click', 'a', function(e) { 
    console.log('clicked'); 
    e.preventDefault(); 
}); 
InstantClick.init(100); 
+0

được nhấp không được hiển thị ngay bây giờ trong nhật ký bảng điều khiển tuy nhiên sau đó không có gì xảy ra. – Ian

+0

Vì bạn đang thực hiện 'e.preventDefault();' và tôi không sử dụng InstantClick, tôi cho rằng InstantClick được cho là kích hoạt liên kết được tải trước khi nhấp chuột? – Niklas

2

thực sự cho các yếu tố DOM động tạo ra bạn cần phải sử dụng trên thay vì một.

$(document).off("click",'a').on('click', 'a', function(e) { 
    console.log('clicked'); 
    e.preventDefault(); 
}); 

nhờ

Các vấn đề liên quan