Call a tab (javascript) through another page

Navigation
1

I have a page called Products. This page has a group of tabs. Ex: tab 1, tab 2 and tab 3). I have in Home a link that needs to call the products page and with tab2 already open. How do I?

The call to tab2 on the Products page is Tab 2

Javascript: 

 <script language="javascript">
    function MyFunction(divName){

    //hidden val
    var hiddenVal = document.getElementById("tempDivName"); 

    //hide old
    if(hiddenVal.Value != undefined){
        var oldDiv = document.getElementById(hiddenVal.Value); 
        oldDiv.style.display = 'none'; 
    }

    //show div
        var tempDiv = document.getElementById(divName); 
        tempDiv.style.display = 'block';              

    //save div ID
        hiddenVal.Value = document.getElementById(divName).getAttribute("id");

    }
</script>

HTML Product Page: 

    <input id="tempDivName" type="hidden" />
    <a href="#" OnClick="MyFunction('myDiv1');"><img class="alignleft size-full wp-image-8214" src="http://totalmed.net.br/wp-content/uploads/2015/08/icons_geis_correlatos.jpg"alt="icons_geis_correlatos" width="166" height="96" /></a>
<a href="#" OnClick="MyFunction('myDiv2');"><img class="alignleft size-full wp-image-8215" src="http://totalmed.net.br/wp-content/uploads/2015/08/icons_ginecologia_obstetricia.jpg"alt="icons_ginecologia_obstetricia" width="166" height="96" /></a>
<a href="#" OnClick="MyFunction('myDiv3');"><img class="alignleft size-full wp-image-8221" src="http://totalmed.net.br/wp-content/uploads/2015/08/icons_suporte_vida.jpg"alt="icons_suporte_vida" width="166" height="96" /></a>

[text_divider type="double"]
<h1>Produtos</h1>
[/text_divider]

<!-- AQUI COMEÇA UM GRUPO DE TAB -->

    <div id="myDiv1" style="display: none;">

    [column width="1/1" last="true" title="Geis e Correlatos" title_type="single" animation="from-left" implicit="true"]

    [tabs layout="vertical" nav_color="accent1" left_color="accent2" right_color="accent4"]
    [tab icon="" title="Acessórios"]

[/column_1]

[column_1 width="1/2" last="true" title="" title_type="single" animation="none" implicit="true"]

<img class="size-full wp-image-7604 aligncenter" src="http://totalmed.net.br/wp-content/uploads/2015/08/geis.png"alt="geis" width="314" height="314" />

[/column_1]
[/tab]

[tab icon="" title="Higienizador Íntimo"]

[blank h="60"]

[/blank]   

[/column]

</div>

    <!-- AQUI COMEÇA UM GRUPO DE TAB -->

    <div id="myDiv2" style="display: none;">

[column width="1/1" last="true" title="Ginecologia e Obstetrícia" title_type="single" animation="from-left" implicit="true"]

[tabs layout="vertical" nav_color="accent1" left_color="accent2" right_color="accent4"]
[tab icon="" title="Cânulas / Cateters / Guias"]    

This is Photoshop's version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet. Aenean

sollicitudin, lorem quis bibendum auctor, nisi elit consequat ipsum.     
    </div>

    <!-- AQUI COMEÇA UM GRUPO DE TAB -->

    <div id="myDiv3" style="display: none;">

[column width="1/1" last="true" title="Suporte à vida" title_type="single" animation="from-left" implicit="true"]

[tabs layout="vertical" nav_color="accent1" left_color="accent2" right_color="accent4"]
[tab icon="" title="Analisadores e Simuladores"]    

[column_1 width="1/2" last="true" title="" title_type="single" animation="none" implicit="true"]

<img class="size-full wp-image-7604 aligncenter" src="http://totalmed.net.br/wp-content/uploads/2015/08/suporte.png"alt="Suporte à vida" width="314" height="314" />

[/column_1]
[/tab]
[/tabs]

[/column]
</div>
    
asked by anonymous 25.09.2015 / 17:18

1 answer

1

I'm not sure how wordpress interprets this but tests like this:

Use the URL that the tab you want to open. In the same way that you use OnClick="MyFunction('myDiv1'); you can use a URL that has query string like this: 

meu.site.com/pasta/subpasta/?tab=myDiv1

and at the start of the page you use, in JS, like this: 

var queryString = location.search.slice(1);
var tab = queryString.match(/tab=(\w+)/);
if (tab) MyFunction(tab[1]);

So it will look in the URL for tab=xxx and if there is going to call the function with the name of the tab.

    
25.09.2015 / 18:33
Class not found in compile by Windows CMD How to return all results from the [PDO] database?