Làm cách nào để đính kèm sự kiện tải trọng cơ thể bằng JS theo cách thức trình duyệt chéo? Đơn giản như thế này?Đính kèm sự kiện tải trọng cơ thể với JS
document.body.onload = function(){
alert("LOADED!");
}
này có lợi thế của DOMContentLoaded - mà cháy trước onload - nhưng cho phép bạn gắn bó trong tất cả các unobtrusiveness của bạn ...
window.onload - Dean Edwards - Các bài viết trên blog đàm phán thêm về nó - và đây là mã hoàn chỉnh sao chép từ ý kiến của cùng một blog.
// Dean Edwards/Matthias Miller/John Resig
function init() {
// quit if this function has already been called
if (arguments.callee.done) return;
// flag this function so we don't do the same thing twice
arguments.callee.done = true;
// kill the timer
if (_timer) clearInterval(_timer);
// do stuff
};
/* for Mozilla/Opera9 */
if (document.addEventListener) {
document.addEventListener("DOMContentLoaded", init, false);
}
/* for Internet Explorer */
/*@cc_on @*/
/*@if (@_win32)
document.write("<script id=__ie_onload defer src=javascript:void(0)><\/script>");
var script = document.getElementById("__ie_onload");
script.onreadystatechange = function() {
if (this.readyState == "complete") {
init(); // call the onload handler
}
};
/*@end @*/
/* for Safari */
if (/WebKit/i.test(navigator.userAgent)) { // sniff
var _timer = setInterval(function() {
if (/loaded|complete/.test(document.readyState)) {
init(); // call the onload handler
}
}, 10);
}
/* for other browsers */
window.onload = init;
Có một số phương pháp khác nhau mà bạn phải sử dụng cho các trình duyệt khác nhau. Các thư viện như jQuery cung cấp cho bạn một giao diện trình duyệt chéo để xử lý tất cả cho bạn.
Tại sao không sử dụng window riêng của sự kiện onload sự kiện?
window.onload = function() {
alert("LOADED!");
}
Nếu tôi không nhầm, điều đó tương thích trên tất cả các trình duyệt.
window.onload xảy ra sau/mọi thứ/được tải, bao gồm cả hình ảnh, vv Nếu bạn muốn bắt đầu thao tác DOM càng sớm càng tốt để ngăn chặn độ trễ khởi động, bạn không thể sử dụng window.onload. – rpjohnst
document.body.onload là một qua trình duyệt, nhưng một cơ chế di sản mà chỉ cho phép một callback đơn (bạn không thể gán nhiều chức năng với nó).
Thay thế "chuẩn" gần nhất, addEventListener không được Internet Explorer hỗ trợ (nó sử dụng attachEvent), vì vậy bạn có thể muốn sử dụng thư viện (jQuery, MooTools, prototype.js, v.v.) để trừu tượng chéo trình duyệt xấu xí cho bạn.
Internet Explorer hỗ trợ 'addEventListener' [kể từ phiên bản 9] (http://msdn.microsoft.com/en-us/library/ie/ff975245 (v = vs.85) .aspx). – Sampson
ý tưởng của jcalfee314 làm việc cho tôi - Tôi có một số window.onload = onLoad có nghĩa là các chức năng trong <body onload="..."> không được gọi (mà tôi không có quyền kiểm soát).
này cố định nó:
oldOnLoad = window.onload
window.onload = onLoad;
function onLoad()
{
oldOnLoad();
...
}
Edit: Firefox không thích oldOnLoad = document.body.onload;, vì vậy thay thế bằng oldOnLoad = window.onload.
Như Rusky đã lưu ý về câu trả lời của Andreas, window.onload khác với document.body.onload; nó xảy ra sau khi mọi thứ được tải, thay vì chỉ là DOM. – Muhd
Kể từ khi Firefox ít nhất là xa như phiên bản 10 không hỗ trợ oldOnLoad = document.body.onload, tôi đang sử dụng một biến thể của điều này: if (oldOnLoad = document.body.onload) {document.body.onload = onLoad; } else {oldOnLoad = window.onload; window.onload = onLoad; }. Điều này dường như cung cấp cho tôi những gì tôi muốn với hầu hết các trình duyệt, với tùy chọn window.onload như một dự phòng khi cần thiết. – arlomedia
Chữ thập sự kiện trình duyệt window.load
function load(){}
window[ addEventListener ? 'addEventListener' : 'attachEvent' ](addEventListener ? 'load' : 'onload', load)
Ngắn và chính xác! –
Công cụ tuyệt vời :) – Jake
Tại sao không sử dụng jQuery?
$(document).ready(function(){}))
Theo như tôi biết, đây là giải pháp hoàn hảo.
Đám cháy này trước khi nạp đầy đủ tài liệu. – rbrundritt
Tại sao không chỉ sử dụng những gì bạn đã làm trong ví dụ của mình? Nó hoạt động cho tôi – Zac