Bagaimana untuk menyegarkan halaman selepas pemadaman jquery

Selepas menggunakan jQuery untuk memadamkan elemen atau item senarai, kadangkala kita perlu memuatkan semula halaman atau memuat semula halaman selepas pemadaman untuk memaparkan data yang dikemas kini. Artikel ini akan menerangkan cara menggunakan jQuery untuk menyegarkan halaman selepas pemadaman dan cara menghalang halaman daripada menyegarkan selepas pemadaman.

1. Muat semula halaman selepas pemadaman

Apabila kami memadamkan elemen atau item senarai, kami berharap data yang dipaparkan pada halaman dapat dikemas kini dalam masa yang ditetapkan. Selepas menggunakan kaedah .remove() jQuery untuk memadamkan elemen atau item senarai, kita boleh menggunakan kaedah location.reload() untuk memuat semula keseluruhan halaman.

Berikut ialah contoh coretan:

$(document).on('click', '.delete-item', function() {
  $(this).closest('li').remove();
  location.reload();
});

Dalam coretan ini, apabila pengguna mengklik butang .delete-item, ia mencari elemen li yang terdekat dan mengalih keluarnya. Kaedah location.reload() kemudian memuatkan semula keseluruhan halaman. Dengan cara ini, data yang dipaparkan pada halaman akan dikemas kini dalam masa.

2. Jangan muat semula halaman selepas pemadaman

Namun, kadangkala kita tidak mahu memuat semula keseluruhan halaman selepas memadamkan elemen. Dalam kes ini, kami boleh menggunakan kaedah $.ajax() jQuery untuk mengemas kini data pada halaman melalui permintaan AJAX tanpa memuat semula keseluruhan halaman.

Berikut ialah contoh coretan:

$(document).on('click', '.delete-item', function() {
  var id = $(this).data('id');
  $.ajax({
    url: '/delete-item',
    type: 'POST',
    data: { id: id },
    success: function(response) {
      $('#' + id).remove();
    }
  });
});

Dalam coretan ini, apabila pengguna mengklik butang .delete-item, ia mendapat ID elemen untuk dipadamkan dan menghantarnya ke pelayan /delete-item laluan di. Laluan pada pelayan akan mengalih keluar elemen dan mengembalikan respons. Selepas respons yang berjaya, kod klien mencari ID elemen yang dipadam pada halaman dan memadamkannya.

Coretan kod di atas menunjukkan cara untuk mengalih keluar elemen di mana keseluruhan halaman tidak perlu dimuat semula. Kaedah ini lebih pantas dan lebih cekap daripada memuat semula keseluruhan halaman, jadi ia sangat popular dalam aplikasi besar.

Ringkasan

Selepas menggunakan jQuery untuk memadam elemen atau item senarai, kami boleh menggunakan kaedah location.reload() untuk memuat semula keseluruhan halaman, atau menggunakan AJAX untuk meminta mengemas kini data pada halaman tanpa menyegarkan keseluruhan halaman. Kaedah yang anda pilih bergantung pada saiz dan keperluan aplikasi anda. Sama ada cara, kita perlu memastikan bahawa elemen yang dialih keluar telah dikosongkan sepenuhnya daripada halaman supaya pembangun boleh menyesuaikan kemas kini halaman mengikut keperluan mereka.

Atas ialah kandungan terperinci Bagaimana untuk menyegarkan halaman selepas pemadaman jquery. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!