1

我正在阅读jQuery 的 .on 事件处理程序的文档并开始使用它。

我有一个简单的 <select> 元素，其中 multiple 属性设置为 true。但是，我希望用户能够选择多个项目而不必按 ctrl 或 shift 键

根据 .on 文档，如果您指定一个选择器，它将自动将这些事件处理程序添加到该容器内添加的与指定选择器匹配的任何新项目中。

因此，就我而言，例如，我可以决定替换列表框中可用的 <option> 元素，但我仍然希望这些选项具有相同的功能，而不必重新绑定这些事件等。

有人可能会认为以下代码段应该可以解决问题（至少，我做到了）：

$('#dropdownlist').on('mousedown', 'option', function(e){
    e.preventDefault();
    $(this).prop('selected', $(this).prop('selected') ? false : true);
    return false;
});

因此，当用户单击该列表框中的选项时，默认操作将被取消，并且根据该项目是否已被选中，它将反转该选择。

我创建了一个小小提琴来展示这种行为：小提琴

在那个小提琴中，第一个下拉列表的行为符合预期，但是在替换项目时功能会丢失。这仅适用于 FF 和 Chrome。

第二个下拉列表是我认为它应该是的（事件处理明智），但除了在 Chrome 中之外，这似乎不起作用-.- 替换项目时保留该功能，因为控制台仍然会记录“2”替换它们后单击一个项目。

有人可以解释一下为什么会这样吗？难道我做错了什么？请指出我正确的方向！

谢谢！

~ 德克

4

1 回答 1

1

IE 不尊重选项标签本身的 mousedown 事件。您必须使用选择标签的 OnChange 事件，这不是您（也不是我）想要的。我正试图做和你完全相同的事情，但每次尝试都被阻止了。我终于放弃了，并将其列为复选框列表，因为我可以从我的行为中得到与你在这里尝试做的相同的行为。

你可以看到这个问题的一些选项，但我从来没有让它按照你描述的方式工作。

于 2013-04-01T23:02:22.033 回答