更新

Question

我有一个表格，我在每一行中使用选择菜单来处理该特定行的不同操作。

例如：

$(document).on('change', '.lead-action', function() {
    // Do stuff
}

此方法获取所选选项的值。根据选定的值，我显示不同的弹出窗口。当用户离开页面时，选择菜单保留先前选择的选项。

有时用户点击选择菜单中的相同选项。当他们这样做时，上面的代码不起作用。

如果选择了选择菜单中的相同选项，是否有办法调用上面的代码块？

Answer 1

我正在收集你只想让下拉菜单在任何时候进行选择。如果是，请查看Fire event each time a DropDownList item is selected with jQuery的答案。

请参阅下面的更新回答：
~~你可以使用这个小扩展名：~~

$.fn.selected = function(fn) {
    return this.each(function() {
        var clicknum = 0;
        $(this).click(function() {
            clicknum++;
            if (clicknum == 2) {
                clicknum = 0;
                fn(this);
            }
        });
    });
}

然后这样打电话：

$(".lead-action").selected(function(e) {
    alert('You selected ' + $(e).val());
});

更新

我实际上对原始剧本不满意。它会在很多情况下中断，任何依赖于检查点击次数两次的解决方案都会变得非常易变。

需要考虑的一些方案：

如果您点击，然后关闭，然后重新开启，则会计算点击次数和点击次数。
在Firefox中，只需单击鼠标即可打开菜单并拖动到所选选项，而无需抬起鼠标。
如果您使用任何键盘敲击组合，您可能会使点击计数器不同步或完全错过更改事件。
- 您可以使用 Alt + ↕（或Chrome和Opera中的空格键）打开下拉列表。
- 当下拉列表具有焦点时，任何箭头键都将更改选择
- 当下拉菜单打开时，点击 Tab 或 Enter 将进行选择

这是我刚刚提出的更全面的扩展：

查看是否选择了某个选项的最有效方法是使用change事件，您可以使用jQuery＆＃39; .change()处理程序处理该事件。

唯一要做的就是确定是否再次选择了原始元素在任何情况下，这都会被提出很多问题（one，two，three）。

最简单的做法是检查click元素上是否有keyup或option:selected事件但是{ {3}} ，即使它们已在Chrome, IE, and Safari don't seem to support events on option elements

中引用

Select元素内部是一个黑盒子。如果您在其上收听事件，您甚至无法确定事件发生的元素或列表是否已打开。

下一个最好的事情是处理blur事件。这将表明用户已经专注于下拉列表（可能看到列表，也许没有），并做出了他们想要坚持原始值的决定。要继续立即处理更改，我们仍会订阅change事件。为了确保我们不会重复计算，如果更改事件被提升，我们会设置一个标记，这样我们就不会反击两次：

w3c recommendation

(function ($) {
    $.fn.selected = function (fn) {
        return this.each(function () {
            var changed = false;
            $(this).focus(function () {
                changed = false;
            }).change(function () {
                changed = true;
                fn(this);
            }).blur(function (e) {
                if (!changed) {
                    fn(this);
                }
            });
        });
    };
})(jQuery);

Answer 2

而不是依赖change（）来使用mouseup（） -

$(document).on('mouseup', '.lead-action', function() {
    // Do stuff
}

这样，如果他们重新选择，你将得到一个你可以处理的事件。

http://jsfiddle.net/jayblanchard/Hgd5z/

再次选择所选选项

2 个答案:

更新

需要考虑的一些方案：

这是我刚刚提出的更全面的扩展：

w3c recommendation