禁用输入以外的文本选择

时间:2011-06-09 22:17:16

标签: javascript jquery

我有这段代码可以禁用所有文本选择。除了输入外,我如何禁用所有文本?我尝试了$('* :not(input)').disableTextSelect();,但它禁用了对所有内容的选择(包括输入)

$.extend($.fn.disableTextSelect = function () {
                return this.each(function () {
                    if ($.browser.mozilla) {//Firefox
                        $(this).css('MozUserSelect', 'none');
                    } else if ($.browser.msie) {//IE
                        $(this).bind('selectstart', function () { return false; });
                    } else {//Opera, etc.
                        $(this).mousedown(function () { return false; });
                    }
                });
            });
            $('* :not(input)').disableTextSelect(); 

3 个答案:

答案 0 :(得分:14)

$(document).bind('mousedown selectstart', function(e) {
    return $(e.target).is('input, textarea, select, option, html');
});

感谢@ user2873592,他提到在此处添加html会修复Chrome滚动条无法拖动问题。

答案 1 :(得分:6)

这适用于IE和FF:

    jQuery(document).ready(function () {
        //Disable default text selection behavior
        toggleEnableSelectStart(false);

        //for inputs it must be possible to select text
        jQuery("input[type=text]").focusin(function () { toggleEnableSelectStart(true); });
        jQuery("input[type=text]").mouseover(function () { toggleEnableSelectStart(true); });
        jQuery("input[type=text]").focusout(function () { toggleEnableSelectStart(false); });
        jQuery("input[type=text]").mouseout(function () { toggleEnableSelectStart(false); });

    });

    function toggleEnableSelectStart(enable) {
        document.onmousedown = function (e) { return enable; };
        document.onselectstart = function (e) { return enable; }; ;
    }

答案 2 :(得分:1)

问题似乎是这种禁用是继承的。因此,即使您没有在$()中选择它们,它们仍会被禁用。但这也可能对我们有利。

禁用后,您可以启用输入。

$('body').css('MozUserSelect', '-moz-none');
$('input').css('MozUserSelect', 'text');

注意:值必须为'-moz-none'。如果“无”,则无法更改。

我无法测试IE,也没有Opera的解决方案。但也许这会有所帮助。