Dropddown标题链接到锚点

Question

I want my dropdown menu header to both open the related menu and show directly the content of the first element of the submenu which is actually an anchor link in the page. Here is the HTML code of the Dropdown Menu:

 <div class="collapse navbar-collapse" id="myNavbar">
  <ul class="nav nav-pills nav-stacked">     
   <li class="dropdown">
      <a href="#" id="myTabDrop1" class="dropdown-toggle" data-toggle="dropdown">Menu</a>
        <ul class="dropdown-menu" role="menu" aria-labelledby="myTabDrop1">
          <li><a href="#submenu1" tabindex="-1" data-toggle="tab">submenu1</a></li>
          <li><a href="#submenu2" tabindex="-1" data-toggle="tab">submenu2</a></li>
        </ul>
    </li> 
  </ul>
</div>  

This is the HTML code of the anchored link:

<div id="myNavbar" class="tab-content">
        <div class="tab-pane fade" id="submenu1">
          <p>submenu1</p>
        </div>
</div>

And this is the JS code I'm trying to use with no success. It works if I write a whole URL like "www.google.com" but not with "#submenu1".

$(document).ready(function() {
  $('.dropdown').on('click', function () {
   window.location="#submenu1";
  });
});

Answer 1

Try using the window.location.hash instead?

window.location.hash=anchorname;

Edit

You're using Twitter bootstrap right? The tabs won't be visible until the active class is added, and since you have a fade class too, I think you'll also need the 'in' class... Try this JS :

$('.dropdown').on('click', function () {
  // Remove any active classes from the tabs
  $('.tab-pane').removeClass('active in');
  // Set the specific #submenu1 to be active
  $('#submenu1').addClass('active in');
  // Scroll the window down to the tabs that are now visible
  window.location.href="#submenu1";
});

I'm not entirely sure what you're trying to achieve though, the links in the dropdown should do the displaying for you... but if you're just trying to force a specific tab to be open when you first click the nav dropdown, then this should do the trick.

Answer 2

you can try with

location.hash=anchorname

location.hash = "Submenu15";
var x = "The anchor " + location.hash;
document.getElementById("demo").innerHTML = x;

fiddle link http://jsfiddle.net/420rL0h2/