ドロップダウンメニューで同じポジションを維持するにはどうすればいいですか

Question

私のフォームにドロップダウンフィールドがあります。ドロップダウンから値を選択すると、すぐにフォームの上部にフォーカスがリセットされます。

私は画面の上部にドロップダウンメニューといくつかの入力フィールドを持っています。ユーザーは、実際のドロップダウンフィールドまでスクロールして選択する必要があります。値を選択すると、ページはスクロールして先頭に戻ります。

ユーザーがドロップダウンから値を選択すると、フォーム上でユーザーが選択した位置を保持するにはどうすればよいですか？私はほぼすべてを試してきました。ここで

は、私はそれが私のコードの特別javascriptの一部としなければならないだろう知っているすべての私のコード

JSFiddle

document.addEventListener("DOMContentLoaded", function(event) { 
 
    // creates the page dynamically 
 
    function GetSelectedItem(){ 
 
    var option = document.getElementById("locale").value; 
 
    } 
 
    
 
    document.getElementById("locale").addEventListener('change', function(event) { 
 
    var selected = event.target.options[ event.target.selectedIndex ].value 
 
    console.log(selected); 
 
    window.location.hash = selected; 
 
    }); 
 
});

<div id="country-select"> 
 
    <form action="" method="get"> 
 
    <select id="locale" name="locale"> 
 
     <option value="en_US" title='0'>English(US)</option> 
 
     <option value="en_GB" title='1'>English(UK)</option> 
 
     <option value="bg_BG" title='2'>Bulgarian</option> 
 
     <option value="cs_CS" title='3'>Czech</option> 
 
     <option value="da_DK" title='4'>Danish</option> 
 
     <option value="de_DE" title='5'>German</option> 
 
     <option value="ek_GR" title='6'>Greek</option> 
 
     <option value="es_ES" title='7'>Spanish</option> 
 
     <option value="et_ET" title='8'>Estonian</option> 
 
     <option value="fi_FI" title='9'>Finnish</option> 
 
     <option value="fr_FR" title='10'>French</option> 
 
     <option value="hu_HU" title='11'>Hungarian</option> 
 
     <option value="it_IT" title='12'>Italian</option> 
 
     <option value="lt_LT" title='13'>Lithuanian</option> 
 
     <option value="lv_LV" title='14'>Latvian</option> 
 
     <option value="nl_NL" title='15'>Dutch</option> 
 
     <option value="no_NO" title='16'>Norwegian</option> 
 
     <option value="pl_PL" title='17'>Polish</option> 
 
     <option value="pt_PT" title='18'>Portugese</option> 
 
     <option value="ro_RO" title='19'>Romanian</option> 
 
     <option value="sk_SK" title='20'>Slovak</option> 
 
     <option value="sl_SL" title='21'>Slovenian</option> 
 
     <option value="sv_SE" title='22'>Swedish</option> 
 
    </select> 
 
    <input value="Select" type="submit"/> 
 
    </form> 
 
</div>

です。

Answer 1

これはあなたのためにはうまくいくと思いますが、私はちょうど変更に焦点を合わせています。

は*フィドルhttps://jsfiddle.net/jjswhccd/1/

$("select#locale").change(function() { 
    $("#locale").blur(); 
});