Как я могу сохранить ту же позицию в моем раскрывающемся меню, когда пользователь выбирает

У меня есть выпадающее поле в моей форме. Когда я выбираю значение из раскрывающегося списка, фокус немедленно сбрасывается в верхнюю часть формы.

Чтобы было понятнее, у меня есть выпадающее меню в верхней части экрана и несколько полей ввода. Пользователю придется прокрутить вниз до фактического выпадающего поля, чтобы выбрать его. Как только они выбирают значение, страница прокручивается обратно наверх.

Как я могу сохранить позицию, выбранную пользователем в форме, когда пользователь выбирает значение из раскрывающегося списка? [ПРИМЕЧАНИЕ: он не будет отображаться при переполнении стека, вам придется скопировать и вставить код и попробовать его в своем собственном браузере]

Мой раскрывающийся список настроен как:

// 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>


person Giorgio    schedule 22.06.2016    source источник


Ответы (1)


Самый простой способ — запустить скрипт для перехода к этой части страницы при запуске функции window.onload:

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

Вам нужно будет добавить дополнительную логику вокруг этого, поскольку вы захотите сделать это только тогда, когда значение было выбрано, но это основной код для прыжка вниз по странице.

person Leo Farmer    schedule 22.06.2016
comment
Спасибо! @Лео Фармер - person Giorgio; 23.06.2016