选择选项标签后，如何导航到另一个页面，然后自动运行jQuery函数？

Question

我正在使用HTML5，jQuery和Javascript创建寻路应用程序。 总共有3个html页面，每个页面都有不同的图例。 在此应用程序中，我具有一些按钮，这些按钮调用jQuery单击功能以在所选位置上方的地图上显示星星。 每个按钮都有一个ID，这些按钮可以按我希望的方式工作。 问题是我想添加一个下拉列表，该列表将提供与图例上的按钮相同的功能。 因此，基本上我想做的是从下拉列表中选择一个部分，然后跳转到具有该部分的页面，并且已经为所选部分显示了星星。 IE：如果我选择“洗手间”，我希望能够跳到地面并在洗手间上方显示星星。 这可能吗？ 我尝试使用Javascript函数使URL导航到我想要的选择列表选项的值，但没有使星星显示出来。 我对Javascript和jQuery相当陌生，所以请帮忙。 谢谢！ 这是我的代码：

HTML：

<form method="get" name="form1" action="">  
 <select name="locations" onchange="gotoSection(this.form)">
      <option selected>Please pick a Section</option>
      <option disabled>---Ground Floor---</option>
      <option value="grdFloor.html#mc" >Mayor's Commision on Literacy</option>
      <option value="grdFloor.html#ch">Children's</option>
      <option value="grdFloor.html#sr">Story Book Room</option>
      <option value="grdFloor.html#eo">Extensions Office</option>
      <option value="grdFloor.html#ma">Montgomery Auditorium</option>
      <option value="grdFloor.html#restRm">Restrooms</option>     
  </select>
</form>

<div id="restRm" class="legend">
    <a href="#restRm" ><img src="floorMaps/restBTN.png"/></a>
</div>      

jQuery的：

$(document).ready(function(){
   $('.legend, .arrows').show('slow');                     
   $('.stars').hide();
       $('#restRm').click(function(){
    $('.stars:not(#restStar1, #restStar2)').fadeOut('slow');
    $('#restStar1, #restStar2').toggle('pulsate');
   }); //end restroom

Javascript：

function gotoSection(form) { 

    var newIndex = form.locations.selectedIndex; 
    if ( newIndex == 0 ) { 
        alert( "Please select a Section!" ); 

    } else { 
        cururl = form.locations.options[ newIndex ].value; 
        window.location.assign( 'http://libwww3.freelibrary.org/maps/central/' + cururl ); 

    } 
}

Answer 1

尝试这个：

<select name="locations" onchange="gotoSection(this.value)">

function gotoSection(cururl) { 
    window.location.assign( 'http://libwww3.freelibrary.org/maps/central/' + cururl ); 
}

编辑：也许我应该在回答之前先阅读整个问题，我认为问题是您的导航无法正常工作，对不起。

但是，关于星星的问题，如果我正确理解了您的问题和示例代码，那么您将在同一页面中导航，只是使用了不同的#hash标签。 如果是这种情况，您的document.ready将不会运行。 相反，您可以创建一个触发星星的函数，并在分配了新的url后从gotoSection方法中调用该函数。