Mengapakah Fungsi `menghidupkan` JavaScript Saya Berfungsi dalam IE tetapi Gagal dalam Chrome?

Fungsi JavaScript 'animate' Gagal dalam Chrome Walaupun Berfungsi dalam IE

Masalah:

Fungsi animasi, digunakan melalui atribut kandungan pengendali acara, gagal dilaksanakan dalam Chrome, sementara ia berfungsi seperti biasa dalam Internet Penjelajah.

Penjelasan:

Dalam Chrome, fungsi animasi global dibayangi oleh Element.prototype.animate yang diperkenalkan baru-baru ini dalam Animasi Web. Bayangan ini timbul disebabkan oleh skop persekitaran leksikal pengendali acara, yang mengutamakan skop elemen sasaran berbanding skop global.

Penyelesaian:

Untuk menyelesaikan isu tersebut , anda boleh sama ada:

• Namakan semula fungsi bernyawa: Gunakan nama lain, seperti animate__, untuk mengelakkan kekeliruan dengan fungsi Element.prototype.animate.

function animate__() {
  var div = document.getElementById('demo');
  div.style.left = "200px";
  div.style.color = "red";
}

• Gunakan kaedah bind(): Bind fungsi bernyawa kepada objek global untuk memastikan ia sentiasa dilaksanakan dalam skop global.

document.getElementById('demo').addEventListener('click', function() {
  animate().bind(window);
});

Atas ialah kandungan terperinci Mengapakah Fungsi `menghidupkan` JavaScript Saya Berfungsi dalam IE tetapi Gagal dalam Chrome?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!