Hướng dẫn javascript not working in firefox but working in chrome - javascript không hoạt động trong firefox nhưng hoạt động trong chrome

Tin tốt, đây không phải là do JavaScript bị vô hiệu hóa trên trình duyệt. Tôi đã thử chạy mã của bạn chống lại Firefox và Vivaldi và có vẻ như Vivaldi, Google Chrome và các trình duyệt web dựa trên crom khác đã bỏ qua yêu cầu của bạn để chèn trình kích hoạt sự kiện. Ý tôi là phần này trong mã của bạn:this isn't because of JavaScript is disabled on the browser. I tried running your code against Firefox and Vivaldi and it seems that Vivaldi, Google Chrome, and other Chromium-based web browsers ignored your request to insert an event trigger. I mean this part of your code:

for (let j = 1; j <= color.length; j++) {
    select[j].addEventListener("click", function colorChange() {
    document.getElementById("box").style.backgroundColor = `${select[j].value}`;
    });
}

Tôi không biết cái nào là chính xác: liệu các kích hoạt sự kiện có thể được thêm vào bên trong các thẻ <option> bên trong <select> hay không. Tôi có thể muốn chuyển tiếp vấn đề này đến nhóm của tôi qua WebCompat.com.

Vì bạn đã chỉ định value cho mỗi <option> (xem container.value = color[i];), bạn thực sự không cần thêm các trình kích hoạt sự kiện này cho mỗi <option>. Thay vào đó, bạn có thể đặt trình kích hoạt trực tiếp bên trong phần tử <select>, thay thế vòng lặp thứ hai của bạn vào điều này:

select.addEventListener("click", function colorChange() {
    document.getElementById("box").style.backgroundColor = select.value;
});

Vì vậy, mã tổng thể sẽ trông như thế này:

const color = [
    "red",
    "black",
    "blue"
];

let select = document.getElementById("select");

for (let i = 0; i < color.length; i++) {
    let container = document.createElement("option");
    container.innerText = color[i];
    container.value = color[i];
    container.id = i+1;
    select.append(container);
}

for (let j = 1; j <= color.length; j++) {
    select[j].addEventListener("click", function colorChange() {
    document.getElementById("box").style.backgroundColor = `${select[j].value}`;
    });
}

select.addEventListener("click", function colorChange() {
    document.getElementById("box").style.backgroundColor = select.value;
});

Chỉnh sửa: Sử dụng trình nghe

select.addEventListener("click", function colorChange() {
    document.getElementById("box").style.backgroundColor = select.value;
});
0 thay vì
select.addEventListener("click", function colorChange() {
    document.getElementById("box").style.backgroundColor = select.value;
});
1 sẽ là một ý tưởng tốt hơn vì hàm
select.addEventListener("click", function colorChange() {
    document.getElementById("box").style.backgroundColor = select.value;
});
2 sẽ chỉ được thực thi nếu giá trị thả xuống đã được thay đổi. Cảm ơn PYB đã chỉ ra điều này.
using the
select.addEventListener("click", function colorChange() {
    document.getElementById("box").style.backgroundColor = select.value;
});
0 listener instead of
select.addEventListener("click", function colorChange() {
    document.getElementById("box").style.backgroundColor = select.value;
});
1 would be a better idea since the
select.addEventListener("click", function colorChange() {
    document.getElementById("box").style.backgroundColor = select.value;
});
2 function will only be executed if the dropdown value has been changed. Thanks to pyb for pointing this out.

Cập nhật: Tôi đã chuyển tiếp điều này đến https://github.com/webcompat/web-bugs/issues/97662. I have forwarded this to https://github.com/webcompat/web-bugs/issues/97662.

Hmm, có rất nhiều nội dung được chèn bởi các tập lệnh trong trang này sau một sự chậm trễ.

Firefox có một số tối ưu hóa để tăng tốc độ phát lại các trang từ bộ đệm có thể bị trục trặc trong một số trường hợp nhất định. Ví dụ: việc phát lại một trang bằng cách sử dụng nút quay lại sẽ không nhất thiết phải kích hoạt sự kiện "onload" trong trang. Bài viết này mô tả cách làm việc xung quanh điều này cho các nhà phát triển web: https://developer.mozilla.org/firefox/releases/1.5/using_firefox_1.5_caching

Đối với người dùng cuối, đây là một vấn đề khó giải quyết. Một bản sửa lỗi một phần có thể là như sau:

. Nhấp vào nút hứa hẹn sẽ cẩn thận.about:config in the address bar and press Return/ Enter. Click the button promising to be careful.

(2) Trong hộp tìm kiếm phía trên danh sách, gõ hoặc dán sess và tạm dừng trong khi danh sách được lọcsess and pause while the list is filtered

.browser.sessionhistory.max_total_viewers preference and change the value from -1 to 0 (that's a zero).

.

Sau đó tải lại trang vấn đề và thử điều hướng đi và quay lại để xem liệu nội dung được chèn có được bảo tồn hay không.

Có thể có một hình phạt hiệu suất nhỏ cho sự thay đổi này, nhưng bạn có thể sẽ không nhận thấy điều đó. Firefox vẫn sẽ sử dụng các tệp được lưu trong bộ nhớ cache, nó sẽ chỉ lắp lại trang theo một cách hơi khác thường hoạt động xung quanh vấn đề này.

Điều đó có tạo ra sự khác biệt nào cho bạn trên trang web đó không?

Hướng dẫn javascript not working in firefox but working in chrome - javascript không hoạt động trong firefox nhưng hoạt động trong chrome

Cor-El nói

Đây có thể là một vấn đề với thuộc tính đích?

Nó hoạt động nếu tôi xóa thuộc tính Target = "_ Top".

Có thể thuộc tính _TOP đang khiến Firefox tìm kiếm tập lệnh trong tài liệu cấp cao nhất (bên ngoài). Đó có phải là một lỗi?

Ảnh chụp màn hình đính kèm

Hướng dẫn javascript not working in firefox but working in chrome - javascript không hoạt động trong firefox nhưng hoạt động trong chrome

Hướng dẫn javascript not working in firefox but working in chrome - javascript không hoạt động trong firefox nhưng hoạt động trong chrome

Đã sửa đổi 17:44:50 -0700 Do 17 de Outubro de 2017 của Bobjtls

Giải pháp được chọn

Mã hoạt động nếu tôi mở iframe trong một tab mới (khung này: khung mở trong tab mới), nhưng không phải khi tài liệu này nằm trong iframe.

Đây có thể là một vấn đề với thuộc tính đích?

Nó hoạt động nếu tôi xóa thuộc tính Target = "_ Top".

Đọc câu trả lời này trong bối cảnh 👍 1 👍 1

Tất cả các câu trả lời (7)

Chào Jscher. Có hai tệp bản vẽ.html. Cái tải ban đầu là tệp bên ngoài chứa tệp iframe đang tải tệp bản vẽ bên trong.html. Tệp bên trong thực sự nằm trong một thư mục phụ. Mã tôi cung cấp là cho tệp bên trong vì đó là mã gây ra vấn đề.

Tôi đính kèm phần có liên quan của mã nguồn cho tệp bên ngoài.

Vì vậy, khi bạn nhấp vào nút Bản vẽ, bạn tải tệp bên ngoài, lần lượt tải tệp bên trong qua iframe.

Xin lỗi, tôi nên mô tả điều này trong bài viết gốc của tôi.

Nó làm cho tôi suy nghĩ, mặc dù, có lẽ trình biên dịch đang bị bối rối. Tôi sẽ đổi tên tệp bên trong và xem điều đó có tạo ra bất kỳ sự khác biệt nào không.

Bobj

Hướng dẫn javascript not working in firefox but working in chrome - javascript không hoạt động trong firefox nhưng hoạt động trong chrome

Đã sửa đổi 12:55:53 -0700 Do 17 de Outubro de 2017 của Bobjtls

Chỉ cần thay đổi tên tệp bên trong thành bản vẽdata.html. Không có sự khác biệt.

Khi trang bên trong tải và bạn di chuyển chuột lên một trong hình thu nhỏ, Firefox sẽ hiển thị cuộc gọi JavaScript trong thanh nhỏ ở phía dưới bên trái của cửa sổ (xem đính kèm). Vì vậy, Firefox nhận ra chính xác rằng thuộc tính HREF của mỏ neo là một cuộc gọi JavaScript.

Hướng dẫn javascript not working in firefox but working in chrome - javascript không hoạt động trong firefox nhưng hoạt động trong chrome

Đã sửa đổi 13:00:54 -0700 Do 17 de Outubro de 2017 của Bobjtls

Tôi đã bỏ lỡ nó! Nó đặt ra một câu hỏi hay: Tại sao nó không hoạt động trong khung, nhưng nếu bạn nhấp chuột phải vào trang đóng khung> Khung này> Khung mở trong tab mới, nó sẽ hoạt động khi nó không được đóng khung. Hmm ...

Đây dường như là một vấn đề với việc đặt kịch bản của bạn vào HREF. Bạn có thể thử thay thế toàn cầu trong trình soạn thảo văn bản của bạn:

Tìm cái gì: href = "JavaScript: href="javascript:

Thay thế bằng: href = "javaScript: void (0);" onclick = " href="javascript:void(0);" onclick="

Trình xử lý onclick chạy đầu tiên, và sau đó liên kết được kích hoạt thứ hai, nhưng href = "javascript: void (0)" đã chết liên kết để ngăn chặn bất kỳ điều hướng mâu thuẫn nào.

Giải pháp được chọn

Mã hoạt động nếu tôi mở iframe trong một tab mới (khung này: khung mở trong tab mới), nhưng không phải khi tài liệu này nằm trong iframe.

Đây có thể là một vấn đề với thuộc tính đích?

Nó hoạt động nếu tôi xóa thuộc tính Target = "_ Top".

Đọc câu trả lời này trong bối cảnh 👍 1

Tất cả các câu trả lời (7)

Bobj

Đã sửa đổi 12:55:53 -0700 Do 17 de Outubro de 2017 của Bobjtls

Chỉ cần thay đổi tên tệp bên trong thành bản vẽdata.html. Không có sự khác biệt.

Khi trang bên trong tải và bạn di chuyển chuột lên một trong hình thu nhỏ, Firefox sẽ hiển thị cuộc gọi JavaScript trong thanh nhỏ ở phía dưới bên trái của cửa sổ (xem đính kèm). Vì vậy, Firefox nhận ra chính xác rằng thuộc tính HREF của mỏ neo là một cuộc gọi JavaScript.

Đã sửa đổi 13:00:54 -0700 Do 17 de Outubro de 2017 của Bobjtls

Tại sao JavaScript của tôi không hoạt động trên Firefox?

Từ menu Công cụ, nhấp vào Tùy chọn (trên PC) hoặc Tùy chọn (trên MAC).Nhấp vào tab Nội dung.Tab nội dung là một trung tâm của các tùy chọn ảnh hưởng đến phông chữ, ngôn ngữ và phương tiện mà trình duyệt Firefox của bạn có thể hiển thị.Nhấp vào Bật JavaScript hoặc bật Java.

JavaScript có bị vô hiệu hóa trong Firefox không?

Trong Firefox, JavaScript được bật theo mặc định.JavaScript is enabled by default.

JavaScript có hoạt động trên Firefox không?

Trên Mozilla Firefox, JavaScript được bật theo mặc định, nhưng bạn có thể kiểm tra nó một cách hợp lý để xác minh xem nó có hoạt động chính xác không.Để làm điều đó, chỉ cần nhập "Giới thiệu: Cấu hình" vào thanh địa chỉ của trình duyệt Firefox của bạn và nhấn phím Enter trên bàn phím của bạn.JavaScript is enabled by default, but you can check it reasonably quickly to verify if it is working correctly. To do that, simply input "about:config" into the Address Bar of your Firefox browser and press the Enter key on your keyboard.

Tại sao JavaScript không hoạt động trong trình duyệt của tôi?

Chuyển đến menu trình duyệt web Nhấp vào tùy chỉnh và kiểm soát Google Chrome.Tiếp theo, chọn Cài đặt và nhấp vào Hiển thị Cài đặt nâng cao.Dưới quyền riêng tư, nhấp vào cài đặt nội dung.Xác định vị trí phần JavaScript và chọn Cho phép tất cả các trang web chạy JavaScript (được đề xuất).