Question

Here I Need Help to Find the solution for my question:

<script type="text/javascript">
        function ShowHide(id)
        {
            $('.datatab').each(function(){
                if($(this).attr('id') != id)
                {
                    $(this).hide();
                }
                else
                {
                    $(this).show();
                }
            });
        }
    </script>

Tab Control:

     <div data-role="navbar">
                <ul>
                    <li class="tabLi"><a onclick="ShowHide('contact')" class="ui-btn-active ui-state-persist">Contact</a></li>
                    <li class="tabLi"><a  onclick="ShowHide('primary')">Primary</a></li>
                    <li class="tabLi"><a  onclick="ShowHide('working')">Working</a></li>
                </ul>
            </div>


<div id="contact" class="datatab" >
    <ul data-role=listview data-inset=true data-theme=d>
      <li data-theme=e  ><font size="1px"> Contact Info </font></li>

      <li><font size="1px"> Phone No : 
      </font></li>
    </ul>
    </div>
    <div id="primary" class="datatab" hidden>
    <ul data-role=listview data-inset=true data-theme=d>
      <li data-theme=e  ><font size="1px"> Contact Info </font></li>

      <li><font size="1px"> Phone No : 
      </font></li>
    </ul>
    </div>
    <div id="working" class="datatab" hidden >
    <ul data-role=listview data-inset=true data-theme=d>
      <li data-theme=e  ><font size="1px"> Contact Info </font></li>

      <li><font size="1px"> Phone No : 
      </font></li>
    </ul>
    </div>

When i’m clicking on the tab it should show the corresponding div now it is showing, but only after refreshing of the page:

My suggestion is to refresh the page when, I enter it through the href. Unfortunately I don’t know the code. Could anyone help me to get out from this…?

Providing jsFiddle link is also usefull for me.

Answer 1

Try this:

document.location.reload()

It should refresh your page.