javascript - jquery how to keep the tab style after a tag jumps

Question

As shown below, the header of this html is shared. Now I want the page to jump to it, but I also need to ensure that the style remains selected after clicking to jump. I use location.href to control the jump in js but it still doesn't work. , it should be reloaded,

What should I do? Can anyone help me~

I want to make it segment-like

伊谢尔伦 · Answer

Option 1: Determine which a tag is highlighted based on your URL
1. Get the URL:

console.log(location.href)
///q/1010000009520710 我测试的是当前页

2. Search for keywords based on the URL. Referring to your code, you can find that each a tag URL has the keyword homepage = '' Recruiting Artists = 'shejishi' Art Works = 'zuopin'
3. Based on the keywords you found Determine which a tag is highlighted

Note: This is relatively simple but may not be very flexible. If the navigation is uncertain, the keywords will also be uncertain, which will not facilitate code maintenance

Option 2: Pass parameters through the URL
1. Modify the a link 'sheijishi/list?index=1', 'zuopin/list?index=2'
2. Get the index value through the a link and set the corresponding a tag highlight
Note: This is more flexible, but the URL looks a bit complicated and unsightly. Another small problem is that if the user directly enters 'shejishi/list', there will be no corresponding highlighting effect

Option 3: localStorage The master above also mentioned it just now. Under normal operation, there is no problem. If the user clicks on 'sheijishi/list' and directly opens the homepage in a new tab, the highlighted one will be 'Recruitment' Artist's Menu

There are many methods, it depends on your personal thoughts to determine the specific plan

高洛峰 · Answer

Determine which li the current page is, and then add select to its sub-a tag

For example, each page defines a var currentTab = '';

For example, on the art work page var currentTab = 'zuopian';

html

招聘美工
美工作品


js

$(function(){
   var currentTab = 'zuopian';
   $('.'+currentTab).find('a').addClass('select'); 

})

PHP中文网 · Answer

jsp is processed like this:

Method to get parameter value in menu.jsp: ${param.item}

Can also be processed with JS:

Get parameters in menu.js:

var item = $("#menu-js").data("item");
alert("=="+item);

習慣沉默 · Answer

After the jump, bring the index of the tab,,, and use js to process it,

给我你的怀抱 · Answer

The simplest way is to pass parameters. If you don’t require the previous browser, you can use localStorage to save the relevant values. Just go to which page to read the values and initialize them