Javascript 在下拉列表/选择列表中选择已选择的项目

我一直在寻找这个问题的答案已经有相当长的一段时间了，没有运气，也没有在max找到问题的解决方案

我面临的问题是，我有一个select元素（显然）在选择已经选择的项目时不会触发“onchange”事件

像这样：

<select onchange="alert(this.value);">
<option>1</option>
<option>2</option>
<option>3</option>
</select>

1.
2.
3.

现在，假设我先选择项目1。 然后，我需要能够再次选择项目1

这个特性对于我正在进行的项目的成功是极其重要的

非常感谢您的帮助

编辑：（更多信息）

当我使用谷歌地图（google maps）进行项目时，需要使用此功能，用户可以通过下拉菜单快速跳转到某个国家（例如，在下拉菜单中选择“西班牙”，谷歌地图会将西班牙设置为您的视图）

当你想去西班牙，然后在地图上拖动鼠标，最后到达意大利时，问题就来了。现在你想回到西班牙，但你不能从下拉列表中选择它，除非你先选择其他东西。我的老板不喜欢这样：）

Edit2：解决方案

所以现在有一些解决方案。 其中之一是在模糊上抛出操作（当取消控件焦点时），这可能会起作用，因为我可以在更改时模糊列表，但对于再次选择相同项目的人，模糊控件的触发器不会启动，除非他们自己切换焦点，否则他们不会看到地图的更改

但我还是不明白，为什么在选择/单击/模糊或其他选项时，要找到一些事件会如此困难。。我会继续自己找，过一会儿再回来看看

编辑3：最终解决方案

是的，所以我终于设法让它工作了，不完全是它本来的样子，但是足够近了，至少现在是这样

我提出的解决方案是在选择列表的顶部添加一个“请选择国家”选项。 然后在更改时，我会将文本和“请选择国家”的值更改为所选项目的值，并将selectedindex重置为0。 这样，当选择西班牙时，在禁用状态下，它将位于列表的顶部，在工作状态下，它将位于列表的底部。所以现在你可以点击名单中间的西班牙人回到西班牙，尽管它仍然被选中（上面的条目）

相当不错，这个想法是由一位同事提出的

脚本如下：

   var dummyOption;
function setdummyCountry(obj)
{
    var selectedOption = obj.options[obj.selectedIndex];
    if (dummyOption != null) {
        dummyOption.text = selectedOption.text;
        dummyOption.value = selectedOption.value;
    }
    else {
        dummyOption = document.createElement("option");
        dummyOption.text = selectedOption.text;
        dummyOption.value = selectedOption.value;
        dummyOption.setAttribute("disabled", "true");
        obj.options[0] = dummyOption;
    }
    obj.selectedIndex = 0;
}

<select onchange="setdummyCountry(this);">
    <option value="">Please select country</option>
    <option value="ES">spain</option>
    <option value="SE">sweden</option>
    <option value="NO">norway</option>
</select>

var-dummyOption；
功能设置国家/地区（obj）
{
var selectedOption=obj.options[obj.selectedIndex]；
如果（dummyOption！=null）{
dummyOption.text=选择的选项.text；
dummyOption.value=selectedOption.value；
}
否则{
dummyOption=document.createElement（“选项”）；
dummyOption.text=选择的选项.text；
dummyOption.value=selectedOption.value；
setAttribute（“禁用”、“真”）；
对象选项[0]=dummyOption；
}
obj.selectedIndex=0；
}
请选择国家/地区
西班牙
瑞典
挪威

我希望这能帮助别人

---

对于那些试图帮助我的人，谢谢你的想法和时间。

这也许不是你真正想要的，但这是你可以决定的另一种选择。 选择该选项后，将其恢复为默认值（空一/第一个）选项

1.
2.
3.

或者你可以

<select onblur="alert(this.value);">
 <option>1</option>
 <option>2</option>
 <option>3</option>
</select>

1.
2.
3.

---

但当用户离开/模糊/取消焦点列表时，这种方式将调用您的函数（警报）：p

我认为如果选择了相同的项目，则无法触发更改事件。我们也面临同样的问题，所以我们所做的只是一个简单的可用性攻击：当选择一个项目时，我们向用户显示在一个范围内选择的项目，并将下拉列表的值重置为其默认值（--Select--）

---

HTH

我在为相同的场景寻找解决方案，最后为相同的场景编写了angularjs指令-

使用

元素[0].blur（）

将焦点从选择标记上移除。逻辑是在第二次单击下拉菜单时触发此模糊

即使用户在下拉列表中选择了相同的值，

as select

也会被触发

---

演示-

如果您将onchange更改为onclick，这对您有帮助吗？您可以添加更多关于为什么需要这种行为的信息吗？我们可能会给你一个更好的选择，只要先写下所有的选项，再添加一个带有

选择的
标签。是否所有选项都在数组中？请解释更多内容#Supertramp在某种程度上是的。我已经读过那篇文章，但其中的解决方案似乎并不能解决我的问题。对于这有多困难，我简直要发疯了。如果我找不到解决方案，我想（糟糕的）解决方案应该是将重置事件绑定到谷歌地图的dragend。因此，每当您拖动时，都会将所选索引重置为“请选择一个项目”或其他内容。我的老板不会喜欢这样的……在我看来，重置ondrag事件是一个不错的方式，是一个很好的可用性设计。一旦你从“西班牙”拖走，你就不再关注西班牙。在“意大利”节目上，但仍然显示“西班牙”为选定国家是没有意义的。
<select onblur="alert(this.value);">
 <option>1</option>
 <option>2</option>
 <option>3</option>
</select>