2010-03-04 41 views
7

Hiện tại tôi đang sử dụng John Resig's LiveQuery plugin/function để cho phép người dùng sắp xếp danh sách danh sách không có thứ tự dài. Mã này như sau: $('input#q').liveUpdate('ul#teams').focus(); Sự cố phát sinh khi tôi sử dụng các tab được đánh dấu để sắp xếp danh sách. Về cơ bản tôi sử dụng ajax để lấy các danh sách khác nhau và chức năng liveUpdate() không có quyền truy cập vào li mới.Làm thế nào để sử dụng jQuery .live() với ajax

Tôi cho rằng tôi cần phải ràng buộc điều này bằng cách sử dụng .live() function. Nhưng tôi không rõ ràng làm thế nào để ràng buộc điều này với một sự kiện ajax, tôi đã chỉ sử dụng sự kiện "click". Làm cách nào để tôi liên kết liveUpdate() mới với các mục danh sách mới tải?

EDIT: Các tab ajax được điều hành thông qua các api wordpress ajax để mã là khá phức tạp, nhưng đơn giản nó là một cái gì đó như thế này:

$('div.item-list-tabs').click(function(event) { 
    var target = $(event.target).parent(); 

    var data = {action, scope, pagination}; // Passes action to WP that loads my tab data 
    $.post(ajaxurl, data, function(response) { 
     $(target).fadeOut(100, function() { 
      $(this).html(response); 
      $(this).fadeIn(100); 
     }); 
    }); 

    return false; 
}); 

này được đơn giản hóa vì lợi ích của cuộc trò chuyện này , nhưng về cơ bản một khi các $.post tải phản ứng tại chỗ .liveUpdate() không có quyền truy cập vào nó. Tôi tin rằng .live() chức năng là câu trả lời cho vấn đề này, tôi chỉ không rõ ràng về cách thực hiện nó với $.post()

+1

Bạn có thể xin vui lòng gửi mã bạn đang sử dụng cho “các tab ajaxified” của bạn? – matdumsa

+0

Tôi đã chỉnh sửa bài đăng gốc bằng các tab ajax js – kylemac

Trả lời

0
$('input#q').live(function() { 
    $(this).liveUpdate('ul#teams').focus(); 
}); 
0
$("div.item-list-tabs").live("click",function(){ 
//statements.. 
}); 
1

Hãy thử sử dụng jQuery's Ajax Events

$('input#q').ajaxComplete(function(){ 
    $(this).liveUpdate('ul#teams').focus(); 

    $(this).unbind('ajaxStop'); 
}); 
4

Như mentionned trong tài liệu của JQuery, .live() được coi là không được chấp nhận. Bạn nên sử dụng phương thức .on() để thay thế.

$("#yourSelector").on("click", function() { 
    // statement 
}); 

Để cũng quản lý đối tượng futur loại selector, bạn có thể sử dụng .Trên() như thế này

$(document).on("click", "#yourSelector", function() { 
    // statement 
}); 
1

Tôi cũng đã gặp rắc rối với việc sử dụng chỉ

$('selector').click(function(.. 

sau một Ajax gọi và cuối cùng thấy rằng chúng tôi cần sử dụng

$('selector').live("click", function(){.. 

hoặc phương pháp mới

$(document).on('click', 'selector', function(){.. 

để ràng buộc sự kiện cho các thành phần mới được tạo sau cuộc gọi Ajax.

$(document).on('click','selector', function(event){ 
//your code  
}); 

Đối với live

$('selector').live('click', function(event){  
//your code  
}); 
Các vấn đề liên quan