Question

在jQuery终端中，我有代码将鼠标向下/向上/移动绑定，以检测用户是否使用了点击而不是拖动。

代码如下所示：

            (function() {
                var count = 0;
                var isDragging = false;
                var $target;
                var name = 'click_' + self.id();
                self.mousedown(function(e) {
                    console.log('down');
                    isDragging = false;
                    $target = $(e.target);
                    if (e.originalEvent.button === 2) {
                        return;
                    }
                    self.oneTime(1, function() {
                        $(window).one('mousemove.terminal_' + self.id(), function() {
                            console.log('move');
                            isDragging = true;
                            count = 0;
                        });
                    });
                }).mouseup(function() {
                    console.log('up');
                    var wasDragging = isDragging;
                    isDragging = false;
                    $(window).off('mousemove.terminal_' + self.id());
                    console.log(wasDragging);
                    if (!wasDragging) {
                        if (++count === 1) {
                            if (!self.enabled() && !frozen) {
                                self.focus();
                                command_line.enable();
                                count = 0;
                            } else {
                                self.oneTime(settings.clickTimeout, name, function() {
                                    if ($target.is('.terminal') ||
                                        $target.is('.terminal-wrapper')) {
                                        var len = self.get_command().length;
                                        self.set_position(len);
                                    } else if ($target.closest('.prompt').length) {
                                        self.set_position(0);
                                    }
                                    count = 0;
                                });
                            }
                        } else {
                            self.stopTime(name);
                            count = 0;
                        }
                    }
                }).dblclick(function() {
                    count = 0;
                    self.stopTime(name);
                });
            })();

（该代码还处理双击，不记得为什么）。

但Chrome / MacOS上存在问题（我在VirtualBox中对其进行了测试，但有人也报告了此问题）即使没有鼠标移动也没有拖动，鼠标移动也会被触发。

似乎mousemove事件（在MacOS / Chrome上）在实际移动鼠标后绑定时会被触发。

是否有更好的解决方案来检测点击但不能拖动，这对MacOS以及其他操作系统/浏览器也有效？

Answer 1

我认为我已经通过使用此跨浏览器功能检查是否选择了任何文本来替换mousemove来解决此问题

var get_selected_text = (function() {
    if (window.getSelection || document.getSelection) {
        return function() {
            var selection = (window.getSelection || document.getSelection)();
            if (selection.text) {
                return selection.text;
            } else {
                return selection.toString();
            }
        };
    } else if (document.selection && document.selection.type != "Control") {
        return function() {
            return document.selection.createRange().text;
        };
    }
    return function() {
        return '';
    };
})();

跨浏览器检测JavaScript

1 个答案: