Question

正在发生的事情是我试图让下拉菜单保持选中的状态但是在我点击提交后它会一直切换到默认状态。有人可以帮助我使用javascript代码，因为我确定这是问题所在吗？谢谢大家，我试图自我学习。

＆＃13;

 function GetSelectedItem(){
		 var option = document.getElementById("locale").value;
}
//THIS WON'T WORK?
function StayOnSelectedItem(){
		 var element = document.getElementById("locale");
		 var value = element.options[element.selectedIndex].value;
	 }

＆＃13;

<!doctype html>  
<html lang="en">
  <head>
	     <meta charset="utf-8">
	     <title>My Website toolbar</title>
	     <link rel="stylesheet" href="languageswitcher.css">
  </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="languageswitcher.js"></script>
  
 </body>
</html>

＆＃13;

Answer 1

 function GetSelectedItem()
 {
     var index = document.getElementById("locale").selectedIndex;    
     alert("value =" + document.getElementById("locale").value); // show selected value
     alert("text =" + document.getElementById("locale").options[index].text); // show selected text 
 }

Answer 2

你的头衔

使用Javascript
从下拉列表（选择框）中获取所选文本

与您的第一句话不是同一个问题：

正在发生的事情是我试图让下拉菜单保持选中的状态，但是在我点击提交后它会一直切换到默认值。

要从下拉列表中的所选选项中获取文本，请使用

var e = document.getElementById('locale');
var text = e.options[e.selectedIndex].text;
console.log(text);

要在单击提交类型的按钮后使表单保持其值，默认情况下应该以这种方式工作。据我所知，浏览器没有理由想要在点击提交类型的按钮时清除下拉字段。

您可以通过在return false;活动中加入onsubmit来测试停止浏览器的默认行为。

<input value="Select" type="submit" onsubmit="GetSelectedItem(); return false;" />

修改：根据您的评论回复，您的实际问题似乎完全不同。如果要在离开页面后保留下拉列表的值，则需要将值存储在某处（最常见的是cookie，SessionStorage或超出Javascript范围的服务器端会话）。

如果您想使用SessionStorage，我建议this MDN article。

使用Javascript在下拉菜单中保留所选项目

2 个答案: