Bagaimanakah Saya Boleh Mencetuskan Peristiwa jQuery dengan Rails 4 dan Turbo-Links?

Memanfaatkan Acara jQuery dalam Rails 4 dengan Turbo-Links

Pemaju Rails 4 sering menghadapi dilema mengatur fail JavaScript semasa menggunakan Turbo-Links . Biasanya, acara "sedia" jQuery digunakan untuk mencetuskan pelaksanaan JavaScript pada pemuatan halaman. Walau bagaimanapun, dengan Turbo-Links didayakan, acara ini gagal berlaku pada peralihan halaman berikutnya.

Untuk menangani isu ini, adalah penting untuk memahami cara Turbo-Links beroperasi. Tidak seperti muat semula halaman tradisional, Turbo-Links membenarkan peralihan halaman yang lancar tanpa memuatkan halaman baharu sepenuhnya. Akibatnya, acara "sedia" jQuery, yang terikat pada proses pemuatan awal DOM, tidak lagi dicetuskan selepas pemuatan halaman pertama.

Nasib baik, Turbo-Links menawarkan penyelesaian. Ia menyiarkan acara "page:load" setiap kali halaman baharu dialihkan ke. Acara ini boleh digunakan untuk meniru gelagat acara "bersedia" jQuery dan memastikan pelaksanaan kod JavaScript yang betul.

Dalam CoffeeScript, ini boleh dicapai seperti berikut:

ready = ->

  # JavaScript code

$(document).ready(ready)
$(document).on('page:load', ready)

Dalam Vanila JavaScript, kod yang setara ialah:

var ready;
ready = function() {

  # JavaScript code

};

$(document).ready(ready);
$(document).on('page:load', ready);

Dengan Rails 5 dan Turbolinks 5, acara "page:load" telah digantikan dengan "turbolinks:load." Dalam kes ini, kod JavaScript boleh dipermudahkan kepada:

$(document).on('turbolinks:load', function() {

  # JavaScript code

});

Dengan menggunakan teknik ini, pembangun Rails 4 boleh memastikan acara jQuery berfungsi dengan pasti walaupun dengan Turbo-Links didayakan, membolehkan pengguna yang lancar dan responsif. pengalaman.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mencetuskan Peristiwa jQuery dengan Rails 4 dan Turbo-Links?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!