forum

Home / DeveloperSection / Forums / How can I make link of a tab using JavaScript?

Ask Question

How can I make link of a tab using JavaScript?

Anonymous User 2719 19-Aug-2013
Hi!

I have a sample page with four tabs (tabs.html). Tabs are displayed as follows:

<ul class="tabs">
    <li><a
href="javascript:tabSwitch('tab1', 'content for first tab');"
id="tab1" class="active"> first tab'</a></li>
    <li><a
href="javascript:tabSwitch('tab2', 'content for second tab');"
id="tab2"> second tab </a></li>
    <li><a
href="javascript:tabSwitch('tab3', 'content for third tab');"
id="tab3"> third tab'</a></li>
  <li><a
href="javascript:tabSwitch('tab4', 'content for fourth tab');"
id="tab3"> fourth tab</a></li>
</ul>

The JavaScript used to switch tabs is:

function tabSwitch(active, number, tab_prefix,
content_prefix) {
    for (var i = 1; i
< number+1; i++) {  
       
document.getElementById(content_prefix+i).style.display = 'none';  
       
document.getElementById(tab_prefix+i).className = '';  
    }  
   
document.getElementById(content_prefix+active).style.display =
'block';  
   
document.getElementById(tab_prefix+active).className = 'selected';      
}

Now, by default, when I link to tabs.html, the first tab is set to active. Is it possible to create a link from another site that links to tabs.html and forces the second or third tab to be active?

Ok
javascript javascript 
Updated on 19-Aug-2013
Anonymous User

Anonymous User

Follow
I am a content writter !

Can you answer this question?

Answer

1 Answers

shreesh chandra shukla

shreesh chandra shukla

19-Aug-2013
Hi!

You can try to get the tab you want to add from the hash like tabs.html#tab1. Then on a code block that run on the page onload do something like this:

var hash = window.location.hash;
if (hash == "#tab1")
    tabSwitch('tab_1', 'content_1');
else if (hash == "#tab2")
    tabSwitch('tab_2', 'content_2');
else if (hash == "#tab3")
    tabSwitch('tab_3', 'content_3');


Liked By