Chiều rộng cửa sổ JQuery không chính xác trong Chrome

Question

Tôi đã tạo một plugin mà tôi đã cắt xuống phần xương trần của plugin (tức là không có chức năng, chỉ cấu trúc) để gỡ lỗi vấn đề này và vẫn tồn tại. Nó đề cập đến việc thay đổi kích thước div và căn cứ trên chiều rộng của tài liệu.

Vấn đề là các tài liệu được báo cáo chiều rộng được giảm 17px so với chiều rộng thực tế của nó và do đó không kích thước các div một cách chính xác.

tôi đã đưa vào cảnh báo để tìm ra nơi mà vấn đề xảy ra: Trước khi "sẵn sàng" chức năng: 1780px (đúng chiều rộng) Bên trong "sẵn sàng" chức năng: 1763px Bên trong Plugin: 1763px (tất cả các giá trị trở về từ "document.width" và "$ (document) .width()" có cùng kết quả)

Điều này chỉ xảy ra trong Chrome và vẫn giữ nguyên ngay cả khi plugin bị giảm hiệu quả không có gì.

Bất kỳ suy nghĩ nào về lý do điều này xảy ra?

Answer 1

Tôi nhận thấy rằng jQuery (cửa sổ) .width() trả về một giá trị sai trong Safari và Chrome.

Answer 2

lấy từ jQuery documentation:

Trong khi JavaScript cung cấp tải sự kiện cho thực thi mã khi một trang được trả lại, sự kiện này không được kích hoạt cho đến khi toàn bộ tài sản như hình ảnh đã hoàn toàn nhận được. Trong hầu hết các trường hợp, tập lệnh có thể chạy ngay sau khi hệ thống phân cấp DOM được xây dựng hoàn chỉnh. Người xử lý đã thông qua tới .ready() được đảm bảo là được thực thi sau khi DOM sẵn sàng, vì vậy đây thường là nơi tốt nhất để đính kèm tất cả các trình xử lý sự kiện khác và chạy mã jQuery khác. Khi sử dụng tập lệnh dựa vào giá trị của thuộc tính phong cách CSS , điều quan trọng là phải các biểu định kiểu bên ngoài tham chiếu hoặc các yếu tố kiểu nhúng trước khi tham chiếu các tập lệnh.

Trong trường hợp mã dựa trên tài sản được nạp (ví dụ, nếu kích thước của một hình ảnh là bắt buộc), mã nên được đặt trong một handler cho sự kiện tải để thay thế.

có lẽ bạn nên sử dụng

$(window).load(function() {}); 

như kích hoạt sự kiện