2

IE8 文本选择问题。

我使用了 jquery ui 并创建了一个可调整大小的 div。所以基本上,当我调整 div 文本的大小时,也会选择它,如果我需要再次调整它的大小,我需要在 LI 之外单击,然后再次调整它的大小。

我试过了

-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;

-webkit-user-drag: none; 
-moz-user-drag: none; 
user-drag: none;

还尝试了一些 js 代码片段,但无法修复它。

我的小提琴:http: //jsfiddle.net/svXTa/16/

有什么帮助吗?

下面是问题的图像。

在此处输入图像描述

4

3 回答 3

2

理想的解决方案是使用 CSS 属性user-select和所有供应商前缀来禁用文本选择:

-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;

不幸的是,IE8 不支持 CSS 解决方案,因此您仍然需要使用 Javascript。

正如 Brandon 建议的那样,jQuery UIdisableSelection()是一种选择,但它可能会产生一些不良副作用:如果您查看jQuery UI 源代码,该函数会通过短路onselectstart事件(如果存在)来工作,否则它将取消onmousedown。由于onselectstart它是非标准的并且在 Firefox 中不受支持,因此这将禁用在该浏览器中的单击,这可能是不可取的。

最好的解决方案是结合使用上述 CSS 和一些 Javascript 来禁用onselectstart,并且只能onselectstart使用以下内容:

$("ul, #dgArea").on("selectstart", function(e) { e.preventDefault(); });
于 2013-12-05T20:39:30.133 回答
2

利用

$('ul, #dgArea').disableSelection();

这只会禁用初始鼠标按下源自这些元素之一的选择。如果鼠标按下从其他地方开始,文本仍然可以突出显示。

如果您不关心人们能够突出显示容器中的文本,则可以将其设置为 .container 级别。

于 2012-08-11T08:38:44.770 回答
1

单靠 CSS 无法完成这项工作。这是一个非常适合我的 IE8 特定的纯 JS 解决方案:

// test if is an old browser with lazyload optimisation
// because I often need to test if it is IE8
function isIE8(){
    var rv = -1; // Return value assumes failure.
    var appName = navigator.appName.toLowerCase();

    if (appName.indexOf('nternet')*appName.indexOf('xplorer') > 1) {
        var ua = navigator.userAgent.toLowerCase();
        var re = new RegExp("msie ([0-9]{1,}[\.0-9]{0,})");
        if (re.exec(ua))
            rv = parseFloat(RegExp.$1);
    }
    // LazyLoad optimisation
    isIE8 = function(){return (rv == 8);};
    return isIE8(); // 2 : call
}

function disableSelection(anElt){
// double check because some browsers mess with navigator.appName and userAgent
if(isIE8 && anElt.attachEvent) 
    anElt.attachEvent("onselectstart", function(){return false;});
}

瞧 :)

于 2015-03-03T10:57:26.217 回答