


js menggunakan kuki untuk menyegarkan menu pokok tanpa mengubah kemahiran it_javascript
Simpan keadaan menu pokok dengan menetapkan kuki dan baca semula kuki apabila halaman dimuatkan untuk menetapkan menu.
Struktur HTML menu:
<div class="treemenu"> <ul> <li> <a href="#" id="treemenu_a_1">一级菜单一</a> <div class="submenu" id="submenu_1"> <ul> <li><a href="subpage/a.html" id="submenu_a_1_1">二级菜单一</a></li> <li><a href="subpage/b.html" id="submenu_a_1_2">二级菜单二</a></li> <li><a href="#" id="submenu_a_1_3">二级菜单三</a></li> <li><a href="#" id="submenu_a_1_4">二级菜单四</a></li> <li><a href="#" id="submenu_a_1_5">二级菜单五</a></li> </ul> </div> </li> <li> <a href="#" id="treemenu_a_2">一级菜单二</a> <div class="submenu" id="submenu_2"> <ul> <li> <a href="#" id="submenu_a_2_1">二级菜单一</a> <div class="submenu" id="submenu_2_1"> <ul> <li><a href="#" id="submenu_a_2_1_1">三级菜单一</a></li> <li><a href="#" id="submenu_a_2_1_2">三级菜单二</a></li> <li> <a href="#" id="submenu_a_2_1_3">三级菜单三</a> <div class="submenu" id="submenu_2_1_3"> <ul> <li><a href="#" id="submenu_a_2_1_3_1">四级菜单一</a></li> <li><a href="#" id="submenu_a_2_1_3_2">四级菜单二</a></li> <li><a href="#" id="submenu_a_2_1_3_3">四级菜单三</a></li> </ul> </div> </li> </ul> </div> </li> <li><a href="#" id="submenu_a_2_2">二级菜单二</a></li> <li><a href="#" id="submenu_a_2_3">二级菜单三</a></li> <li><a href="#" id="submenu_a_2_4">二级菜单四</a></li> <li><a href="#" id="submenu_a_2_5">二级菜单五</a></li> </ul> </div> </li> <li> <a href="#" id="treemenu_a_3">一级菜单三</a> <div class="submenu" id="submenu_3"> <ul> <li><a href="#" id="submenu_a_3_1">二级菜单一</a></li> <li><a href="#" id="submenu_a_3_2">二级菜单二</a></li> <li><a href="#" id="submenu_a_3_3">二级菜单三</a></li> <li><a href="#" id="submenu_a_3_4">二级菜单四</a></li> <li><a href="#" id="submenu_a_3_5">二级菜单五</a></li> </ul> </div> </li> </ul> </div>
Baca kelas alat kuki:
//cookie工具类 var cookieTool = { //读取cookie getCookie: function(c_name) { if (document.cookie.length > 0) { c_start = document.cookie.indexOf(c_name + "="); if (c_start != -1) { c_start = c_start + c_name.length + 1; c_end = document.cookie.indexOf(";", c_start); if (c_end == -1) { c_end = document.cookie.length; } return unescape(document.cookie.substring(c_start, c_end)); } } return ""; }, //设置cookie setCookie: function(c_name, value, expiredays) { var exdate = new Date(); exdate.setDate(exdate.getDate() + expiredays); //设置日期 document.cookie = c_name + "=" + escape(value) + ((expiredays == null) ? "" : ";expires=" + exdate.toGMTString()); }, //删除cookie delCookie: function(c_name) { var exdate = new Date(); exdate.setDate(exdate.getDate() - 1); //昨天日期 document.cookie = c_name + "=;expires=" + exdate.toGMTString(); } };
Pengikatan acara menu:
//菜单事件绑定 $('.treemenu a').bind('click', function() { var $this = $(this); var id = $this.attr('id'); var $submenu = $this.next('.submenu'); if ($submenu.length > 0) { //是否有子菜单 var flag = $(this).next('.submenu:hidden').length > 0 ? true : false; if (flag) { $submenu.show(); } else { $submenu.hide(); } var display = flag ? 'block' : 'none'; cookieTool.setCookie(id, display, 10); } else { cookieTool.setCookie(id, id, 10); var curId = cookieTool.getCookie(id); $('.treemenu').find('.on').removeClass('on').addClass('off'); $('#' + curId).addClass('on'); $('.treemenu a[class="off"]').each(function() { cookieTool.delCookie($(this).attr('id')); //删除其他已选择选项cookie }); } });
Tetapkan semula menu apabila halaman dimuatkan
//页面加载读取cookies $('.treemenu a').each(function() { showMenu($(this).attr('id')); }); //读取cookie显示菜单 function showMenu(id) { var $this = $('#' + id); var cookie = cookieTool.getCookie(id); if (cookie) { if ($this.next('.submenu').length > 0) { $this.next('.submenu').css('display', cookie); } else { $('#' + cookie).addClass('on'); } } }
DEMO Penuh:
[JavaScript] Muat semula tidak mengubah menu pokok (menu berbilang peringkat).zip
Nota: Konsol tempatan Chrome tidak boleh membaca kuki dan perlu diuji dalam firefox/IE atau persekitaran pelayan

Alat AI Hot

Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool
Gambar buka pakaian secara percuma

Clothoff.io
Penyingkiran pakaian AI

Video Face Swap
Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Artikel Panas

Alat panas

Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6
Alat pembangunan web visual

SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas



Apabila anda menyemak imbas web pada iPhone anda, kandungan yang dimuatkan disimpan buat sementara waktu selagi apl penyemak imbas kekal terbuka. Walau bagaimanapun, tapak web mengemas kini kandungan dengan kerap, jadi menyegarkan halaman adalah cara yang berkesan untuk mengosongkan data lama dan melihat kandungan yang diterbitkan terkini. Dengan cara ini, anda sentiasa mendapat maklumat dan pengalaman terkini. Jika anda ingin memuat semula halaman pada iPhone, siaran berikut akan menerangkan kepada anda semua kaedah. Cara Muat Semula Halaman Web pada Safari [4 Kaedah] Terdapat beberapa kaedah untuk memuat semula halaman yang anda lihat pada Apl Safari pada iPhone. Kaedah 1: Gunakan Butang Muat Semula Cara paling mudah untuk memuat semula halaman yang telah anda buka di Safari ialah menggunakan pilihan Muat Semula pada bar tab penyemak imbas anda. Jika Safa

Adakah kunci F5 tidak berfungsi dengan betul pada PC Windows 11/10 anda? Kekunci F5 biasanya digunakan untuk menyegarkan desktop atau penjelajah atau memuat semula halaman web. Walau bagaimanapun, sesetengah pembaca kami telah melaporkan bahawa kekunci F5 sedang menyegarkan komputer mereka dan tidak berfungsi dengan betul. Bagaimana untuk mendayakan penyegaran F5 dalam Windows 11? Untuk menyegarkan semula PC Windows anda, hanya tekan kekunci F5. Pada sesetengah komputer riba atau desktop, anda mungkin perlu menekan kombinasi kekunci Fn+F5 untuk menyelesaikan operasi muat semula. Mengapa penyegaran F5 tidak berfungsi? Jika menekan kekunci F5 gagal menyegarkan semula komputer anda atau anda mengalami masalah pada Windows 11/10, ia mungkin disebabkan oleh kekunci fungsi yang dikunci. Punca lain yang berpotensi termasuk papan kekunci atau kekunci F5

Kuki biasanya disimpan dalam folder kuki penyemak imbas antara muka pengurusan kuki yang disediakan oleh penyemak imbas anda untuk melihat dan mengurus kuki.

Kuki pada komputer anda disimpan di lokasi tertentu pada penyemak imbas anda, bergantung pada penyemak imbas dan sistem pengendalian yang digunakan: 1. Google Chrome, disimpan dalam C:\Users\YourUsername\AppData\Local\Google\Chrome\User Data\Default \Cookies dll.

Penyegaran halaman adalah perkara biasa dalam penggunaan rangkaian harian kami Apabila kami melawat halaman web, kadangkala kami menghadapi beberapa masalah, seperti halaman web tidak dimuatkan atau dipaparkan secara tidak normal, dsb. Pada masa ini, kami biasanya memilih untuk memuat semula halaman untuk menyelesaikan masalah, jadi bagaimana untuk memuat semula halaman dengan cepat? Mari kita bincangkan kekunci pintasan untuk muat semula halaman. Kekunci pintasan muat semula halaman ialah kaedah untuk memuat semula halaman web semasa dengan pantas melalui operasi papan kekunci. Dalam sistem pengendalian dan penyemak imbas yang berbeza, kekunci pintasan untuk muat semula halaman mungkin berbeza. Di bawah ini kami menggunakan W biasa

Kuki pada telefon mudah alih disimpan dalam aplikasi penyemak imbas peranti mudah alih: 1. Pada peranti iOS, Kuki disimpan dalam Tetapan -> Safari -> Lanjutan -> Data Laman Web pelayar Safari 2. Pada peranti Android, Kuki Disimpan; dalam Tetapan -> Tetapan tapak -> Kuki penyemak imbas Chrome, dsb.

Prinsip kerja kuki melibatkan pelayan menghantar kuki, pelayar menyimpan kuki, dan pelayar memproses dan menyimpan kuki. Pengenalan terperinci: 1. Pelayan menghantar kuki, dan pelayan menghantar pengepala respons HTTP yang mengandungi kuki ke penyemak imbas. Kuki ini mengandungi beberapa maklumat, seperti pengesahan identiti pengguna, keutamaan, atau kandungan troli beli-belah Selepas pelayar menerima kuki ini, ia akan disimpan pada komputer pengguna 2. Pelayar menyimpan kuki, dsb.

Dengan populariti Internet, kami menggunakan pelayar untuk melayari Internet telah menjadi satu cara hidup. Dalam penggunaan harian penyemak imbas, kita sering menghadapi situasi di mana kita perlu memasukkan kata laluan akaun, seperti membeli-belah dalam talian, rangkaian sosial, e-mel, dsb. Maklumat ini perlu direkodkan oleh penyemak imbas supaya ia tidak perlu dimasukkan lagi pada kali berikutnya anda melawat. Ini adalah apabila kuki berguna. Apakah cookies? Kuki merujuk kepada fail data kecil yang dihantar oleh pelayan ke penyemak imbas pengguna dan disimpan secara setempat Ia mengandungi gelagat pengguna beberapa tapak web.
