创建基于从下拉菜单

Question

选择哪一选项查询字符串我有这个下拉菜单：

<select name="Filter" onchange="applyFilter(this);"> 
<option name="Item1" id=Item1 value="10.5">Test1</option> 
<option name="Item2" id=Item2 value="27">Test2</option> 
<option name="Item3" id=Item3 value="31">Test3</option> 
</select> 

我还在学习JavaScript和想写生成/加载查询字符串的函数URL并将所选项目的值作为参数传递。下拉菜单中的每个选项都需要有自己的ID。这是我到目前为止的代码：

<script language="javascript1.2" type="text/javascript"> 
function applyFilter() 
{ 
var currentQS = ''; 
var currentObject; 
var currentURL = '' + window.location.href; 

currentQS = unescape(window.location.search); 
var newQS = ''; 

currentObject = document.getElementById('Item1'); 
newQS = $Querystring(newQS).set(currentObject.name,currentObject.value).toString(); 
newQS = newQS.substring(1,newQS.length); 

currentObject = document.getElementById('Item2'); 
newQS = $Querystring(newQS).set(currentObject.name,currentObject.value).toString(); 
newQS = newQS.substring(1,newQS.length); 

currentObject = document.getElementById('Item3'); 
newQS = $Querystring(newQS).set(currentObject.name,currentObject.value).toString(); 
newQS = newQS.substring(1,newQS.length); 

var newURL = 'http://' + location.hostname + location.pathname + '?' + newQS; 
window.location = newURL; 
} 
</script> 

任何帮助，这将不胜感激。

Answer 1

不知道什么$Querystring指，但你应该能够做到这样的：

document.getElementsByName('Filter')[0].addEventListener('change', function() { 
    window.location = 'http://' + location.hostname + location.pathname + '?' + this.name + '=' + this.options[this.selectedIndex].value; 
}); 

然而，选择菜单可能不是你想要做什么是最好的选择。看看这篇博文：http://uxmovement.com/forms/stop-misusing-select-menus/