2012-02-25 25 views
5

Tôi có một trang mà tôi đang sử dụng jQuery UI Tabs, những gì tôi đang làm là tải nội dung của từng tab qua Ajax, nhưng vấn đề tôi gặp phải là rằng, trong nội dung của các tab của tôi, các nút (tôi đang sử dụng jQuery ui button) mất tất cả các lớp học jquery ui của họ, có nghĩa là:giữ lại các lớp phần tử jquery-ui sau jquery .load()

Khi tải trang cho lần đầu tiên, các nút của tôi trông như thế này:

<button class="my_button ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only"> 
<span class="ui-button-icon-primary ui-icon ui-icon-plusthick"></span> 
</button> 

Như bạn có thể thấy, các nút của tôi có tất cả các lớp jquery-ui ui-button, ui-widget, etc.... Ngoài ra, các nút của tôi có một khoảng thời gian hiển thị dấu cộng (+) làm nhãn cho các nút của tôi. Do đó, các nút của tôi hiển thị chính xác.

Nhưng khi tôi tải cùng một nội dung (trong đó có các nút giống nhau) thông qua Ajax, các nút của tôi trở nên như thế này:

<button class="my_button"></button> 

Như bạn thấy, tôi mất tất cả các lớp ui jQuery nút của tôi. Do đó, nút không được tạo kiểu

Làm cách nào để khắc phục sự cố này?

LƯU Ý: Xin lưu ý rằng tôi đã không thêm các lớp jquery-ui thủ công vào các nút của tôi trong HTML của tôi. Khi bạn khởi tạo các nút bằng cách sử dụng $(".my_button").button(); trong jQuery, jQuery sẽ tự động áp dụng tất cả các lớp jquery-ui cần thiết cho nút của tôi một cách thích hợp. Vì vậy, xin vui lòng không cho tôi biết đó là bởi vì tôi đã không chỉ định các lớp học jquery-ui cho các nút của tôi trả trước (tôi không cần phải). Ngoài ra, tôi đã thử .live(), .delegate(), không ai trong số đó hoạt động.

Xin hãy giúp tôi với bất cứ ai này

Cảm ơn bạn

+0

Tôi không chắc chắn nhưng một khi tôi đã phải đối mặt với vấn đề này và giải quyết nó bằng cách tôi trả lời nó. –

Trả lời

4

tôi đã phải đối mặt với vấn đề này một lần và giải quyết vấn đề này bằng cách sử dụng cuộc gọi document.ready như

function myreadyFunc(){ 
    $(".my_button").button(); 
    // Other codes 
} 

Tôi có tài liệu của tôi. sẵn sàng như sau

$(document).ready(function(){ 
    myreadyFunc(); 
}); 

Sau mỗi cuộc gọi ajax (thành công) tôi đã sử dụng để gọi

myreadyFunc(); 

Hy vọng điều này cũng sẽ giúp bạn. Tôi đã sử dụng phương pháp này để thực thi mã của document.ready mà không thể thực hiện bằng cách gọi document.ready sau mỗi cuộc gọi ajax.

+0

Bạn có đặt 'myreadyFunc()' bên ngoài '$ (document) .ready()' không? Nguyên nhân tôi chỉ cố gắng này và nó không hoạt động – user765368

+0

Có bạn nên đặt myreadyFunc() bên ngoài $ (tài liệu) .ready() –

+0

Vì vậy, nói cách khác, bạn đặt tất cả các mã chứa trong '$ (tài liệu) của bạn. ready() 'bên trong' myreadyFunc() '? và gọi 'myreadyFunc()' bên trong '$ (document) .ready()' AND sau mỗi Ajax gọi? – user765368

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