用户选择后如何在下拉菜单上保持相同的位置答案

【问题标题】：How can I keep the same position on my drop down menu once a user selects用户选择后如何在下拉菜单上保持相同的位置
【发布时间】：2016-06-22 19:19:38
【问题描述】：

我的表单上有一个下拉字段。当我从下拉列表中选择一个值时，它会立即将焦点重置到表单的顶部。

为了更清楚，我在屏幕顶部有一个下拉菜单和几个输入字段。用户必须向下滚动到实际的下拉字段才能选择它。一旦他们选择了值，页面就会滚动回顶部。

一旦用户从下拉列表中选择了一个值，如何保持用户在表单上选择的位置？ [注意：堆栈溢出时不会显示，您必须复制并粘贴代码并在您自己的浏览器上尝试]

我的下拉菜单设置为：

// creates the page dynamically
	function GetSelectedItem(){
		 var option = document.getElementById("locale").value;
	}

<!doctype html>  
<html lang="en">
  <head>
	     <meta charset="utf-8">
	     <title></title>
	     <link rel="stylesheet" href="languageswitcher.css">
		 <script>
		  window.onload{
		  document.getElementById("locale").options[value].selected;
		  }
		  
		  </script>
  </head>
 
  <body>
 
    <header>
 
      <div id="country-select">
        <form action="" method = "get">
          <select id= "locale" name="locale">
			<option value="en_US">English(US)</option>
			<option value="en_GB">English(UK)</option>
	                <option value="bg_BG">Bulgarian</option>
	                <option value="cs_CS">Czech</option>
	                <option value="da_DK">Danish</option>
			<option value="de_DE">German</option>
			<option value="ek_GR">Greek</option>
			<option value="es_ES">Spanish</option>
	    	        <option value="et_ET">Estonian</option>
			<option value="fi_FI">Finnish</option>
			<option value="fr_FR">French</option>
			<option value="hu_HU">Hungarian</option>
			<option value="it_IT">Italian</option>
			<option value="lt_LT">Lithuanian</option>
			<option value="lv_LV">Latvian</option>
			<option value="nl_NL">Dutch</option>
			<option value="no_NO">Norwegian</option>
			<option value="pl_PL">Polish</option>
			<option value="pt_PT">Portugese</option>
			<option value="ro_RO">Romanian</option>
			<option value="sk_SK">Slovak</option>
			<option value="sl_SL">Slovenian</option>
			<option value="sv_SE">Swedish</option>
          </select>
          <input value="Select" type="submit"/>
        </form>
      </div>
    </header>
	<script src="jquery_1.5.min.js"></script>
    <script src="languageswitcher.js"></script>
 </body>
</html>

【问题讨论】：

标签： javascript html drop-down-menu

【解决方案1】：

当您运行 window.onload 函数时，最简单的方法是运行脚本以跳转到页面的该部分：

window.onload{
      document.getElementById("locale").options[value].selected;
      window.location.hash="country-select"; 
}

您需要在它周围添加一些额外的逻辑，因为您只想在选择了一个值时才这样做，但这是跳下页面的基本代码。

【讨论】：

谢谢！ @Leo Farmer