2010-05-11 47 views
28

Tôi đã có đoạn mã sau vào một trang web:sự kiện JavaScript window.onload không được kích hoạt

window.onload = resize; 
window.onresize = resize; 

function resize(){ 
    heightWithoutHeader = (window.innerHeight - 85) + "px"; 
    document.getElementById("main-table").style.height = heightWithoutHeader; 
    document.getElementById("navigation").style.height = heightWithoutHeader; 
} 

Các onresize hoạt động tốt, nhưng sự kiện onload không bao giờ cháy. Tôi đã thử nó trong Firefox và Chrome và cả hai đều không hoạt động.

Cảm ơn sự giúp đỡ của bạn và đi tìm danh tiếng! ; D

+3

Khi nào bạn chạy mã này? Có thể là 'onload' đang bị ghi đè sau này hay đang được gắn sau khi sự kiện' load' kích hoạt? –

+0

Bạn đã đúng. window.onload rõ ràng đã bị ghi đè bởi sau đó. Đăng bình luận của bạn như là một câu trả lời xin vui lòng, vì vậy tôi có thể đánh dấu nó như là một trong những quyền. –

+0

Xong :) Rất vui khi bạn giải quyết nó! –

Trả lời

48

Tôi nghĩ rằng những gì có thể xảy ra ở đây là window.onload của bạn đang được ghi đè sau, kiểm tra để chắc chắn rằng nó không phải qua những thứ như <body onload="">

Bạn có thể kiểm tra điều này bằng cách alert(window.onload) tại của bạn tái kích thước chức năng, để xem những gì thực sự gắn liền ở đó.

-3

Nếu nó thực sự theo thứ tự đó, chắc chắn nó sẽ không hoạt động. Bạn không thể gán một hàm cho một trình xử lý sự kiện trước khi chính hàm đó được khai báo.

+0

Tôi đã thay đổi thứ tự ngay bây giờ nhưng nó vẫn không hoạt động. –

+0

Như Nick Craver đã nói, nó sẽ rất hữu ích để biết bối cảnh lớn hơn của điều này và khi nó thực sự được gọi. – Syntactic

+1

câu trả lời sai: trong cùng một phạm vi javascript được phép, nhưng không được đề xuất, để khai báo một biến hoặc hàm sau khi sử dụng nó. thử: "var a = fun (42); hàm fun (n) {return n;}; console.log (a);" – Francois

0

Đây sẽ là nơi làm việc khi bạn gọi "window.onload" bên cạnh các chức năng thay đổi kích thước()

2

này làm việc cho tôi, tôi nghĩ rằng vấn đề của bạn là ở một nơi khác:

function resize(){ 
    var tester = document.getElementById("tester"), 
     html = tester.innerHTML 

    tester.innerHTML = html + "resize <br />" 
} 

window.onload = resize; 
window.onresize = resize; 

bạn có thể tự mình thử nghiệm tại đây: http://jsfiddle.net/Dzpeg/2/

bạn có chắc chắn sự kiện duy nhất được gọi là onLoad không? Có lẽ một sự kiện onLoad khác tạo ra một cuộc xung đột

19

Tôi đã xảy ra điều này khi tôi thêm mã jQuery của bên thứ 3 mà chúng tôi cần cho đối tác. Tôi có thể dễ dàng chuyển đổi window.onload cũ của tôi sang một tài liệu jQuery đã sẵn sàng. Điều đó nói rằng, tôi muốn biết nếu có một ngày hiện đại, giải pháp tương thích trình duyệt chéo.

Có IS!

window.addEventListener ? 
window.addEventListener("load",yourFunction,false) : 
window.attachEvent && window.attachEvent("onload",yourFunction); 

Biết rằng tôi có thể chuyển đổi mã của mình để sử dụng tuyến đường jQuery. Và, tôi sẽ yêu cầu đối tác của chúng tôi refactor mã của họ để họ ngừng ảnh hưởng đến các trang web.

Nguồn nơi tôi tìm thấy việc sửa chữa ->http://ckon.wordpress.com/2008/07/25/stop-using-windowonload-in-javascript/

0

Di chuyển dòng window.onload đến cuối của tập tin javascript hoặc sau khi chức năng ban đầu và nó sẽ làm việc:

function resize(){ 
    heightWithoutHeader = (window.innerHeight - 85) + "px"; 
    document.getElementById("main-table").style.height = heightWithoutHeader; 
    document.getElementById("navigation").style.height = heightWithoutHeader; 
} 
// ... 
// at the end of the file... 
window.onload = resize; 
window.onresize = resize; 

Nhưng nó thực hành tốt nhất nếu bạn không thay thế quá tải. Thay vào đó, hãy đính kèm chức năng của bạn vào sự kiện onload:

function resize(){ 
    heightWithoutHeader = (window.innerHeight - 85) + "px"; 
    document.getElementById("main-table").style.height = heightWithoutHeader; 
    document.getElementById("navigation").style.height = heightWithoutHeader; 
} 
// ... 
// at the end of the file... 
window.addEventListener ? 
    window.addEventListener("load",resize,false) 
    : 
    window.attachEvent && window.attachEvent("onload",resize); 

Điều đó làm việc cho tôi và xin lỗi vì tiếng anh của tôi.

0

Đối với tôi, window.onload không hoạt động khi đã viết trong thẻ script type="text/javascript.

Thay vào đó, cần viết giống như trong thẻ script language="Javascript" type="text/javascript và thẻ hoạt động tốt.

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