0

目标： 每当有人从下拉列表中选择选项时加载 href 值 -即使该选项已被选中。

问题： 虽然下面的代码可以工作，但是当某些选项已经被选中（单击）时它不起作用。例如，假设我点击了“按价格”选项。将加载新页面（很好），默认选择“按价格”选项，现在它位于“按名称”选项上方的列表顶部。

现在我想再次选择“按价格”选项，现在加载页面将无法正常工作。

HTML：

<select name="" class="inputbox" size="1" onchange="window.top.location.href=this.options[this.selectedIndex].value">
    <option value="/index.php/by,product_name">By name</option>
    <option value="/index.php/by,mf_name">By MF</option>
    <option value="/index.php/by,product_price">By price</option>
    <option value="/index.php/by,product_special">By type</option>
</select>
4

5 回答 5

0

You shouldn't make such a workflow, not only because its hard to maintain for all browsers, its hard for keyboard-accessibility (WCAG), so if you are binding it to "onchange" you are not bothering of keyboard-users pressing up and down when that thing has focus.

what if you bind it when loosing the focus (onblur)?

于 2013-01-12T19:46:59.267 回答
0
  • 将方法绑定到保存选择和删除选择的 onfocus
  • 那么 onchange 总是会被触发。在那里你可以做任何你想做的事（即使使用原始保存的选择）
于 2013-01-12T19:58:28.727 回答
0

在您的选择框中添加一个空选项。如果要选择已选择的内容，请先选择此空白选项，然后再选择您想要的选项。这样它就会起作用。

<select name="" class="inputbox" size="1" onchange="if(this.options[this.selectedIndex].value) window.top.location.href=this.options[this.selectedIndex].value">
    <option value="">---</option>
    <option value="/index.php/by,product_name">By name</option>
    <option value="/index.php/by,mf_name">By MF</option>
    <option value="/index.php/by,product_price">By price</option>
    <option value="/index.php/by,product_special">By type</option>
</select>
于 2013-01-12T19:43:16.360 回答
0 
$('select').blur(function(){
    window.location = $('option:selected', this).val();
});

模糊将始终以您想要的方式捕获。

工作的jsFiddle ...

于 2013-01-12T19:43:23.100 回答
0

由于您无论如何都在加载新页面，请重置所选索引

onchange="var val=this.options[this.selectedIndex].value;
this.selectedIndex=0;
window.top.location.href=val">
于 2013-01-12T20:06:33.660 回答