Javascript非選擇性文本在Chrome/IE中不工作

在Firefox看起來很好，Chrome和IE的文本仍然可以選擇，有沒有辦法解決這個問題？代碼取自另一個問題（我現在找不到），所以它可能已過時？Javascript非選擇性文本在Chrome/IE中不工作

// Prevent selection 
function disableSelection(target) { 
    if (typeof target.onselectstart != "undefined") //IE route 
     target.onselectstart = function() { return false } 
    else if (typeof target.style.MozUserSelect != "undefined") //Firefox route 
     target.style.MozUserSelect = "none" 
    else //All other route (ie: Opera) 
     target.onmousedown = function() { return false } 
}

用於代碼：

disableSelection(document.getElementById("gBar"));

來源

2010-11-30 Tom Gullen

爲什麼你想這樣做？即使讓它起作用，再次使文本可選也與禁用javascipt或查看源代碼一樣簡單。只有真正阻止選擇的方式是提供圖像，這會導致各種可訪問性問題，並隱藏搜索引擎中的文本。 – tdammers 2010-11-30 10:05:09

我知道有人會問這個問題，我完全意識到這些問題，但這不是爲了保護數據，它只是爲了提高我正在製作的Web應用程序的性能，所以當用戶拖放元素時其中包含的文本不會開始被選中，並使應用程序行爲奇怪。 – 2010-11-30 10:08:31

我最近有一個像這樣的問題，並解決了它與jQuery升級:) – sje397 2010-11-30 10:17:29

對於webkit的使用khtmlUserSelect代替MozUserSelect。

在歌劇和MSIE，您可以設置不可選擇的屬性爲「開」

至於壁虎/ WebKit的相關的兩種風格是CSS，你可以使用一個類來應用它：

<script type="text/javascript"> 
<!-- 
function disableSelection(target) 
{ 
    target.className='unselectable'; 
    target.setAttribute('unselectable','on'); 
} 
//--> 
</script> 
<style type="text/css"> 
<!-- 
.unselectable{ 
-moz-user-select:none; 
-khtml-user-select: none; 
} 
--> 
</style>

注意：不可選項不會傳遞子元素，因此如果除了targetNode中的textNodes以外還有其他內容，則需要爲MSIE/opera準備好的解決方法。

來源

2010-11-30 10:07:20

與Firefox中的MozUserSelect樣式類似，您可以使用-webkit-user-select: none用於基於Webkit的瀏覽器（如Safari和Chrome）。

我認爲你可以在Opera中使用-o-user-select: none。但我沒有測試過它。

// Prevent selection 
function disableSelection(target) { 
    if (typeof target.onselectstart != "undefined") //IE route 
     target.onselectstart = function() { return false } 
    else if (typeof target.style.userSelect != "undefined") //Some day in the future? 
     target.style.userSelect = "none" 
    else if (typeof target.style.webkitUserSelect != "undefined") //Webkit route 
     target.style.webkitUserSelect = "none" 
    else if (typeof target.style.MozUserSelect != "undefined") //Firefox route 
     target.style.MozUserSelect = "none" 
    else //All other route (ie: Opera) 
     target.onmousedown = function() { return false } 
}

對於IE，也許這可以幫助你：http://msdn.microsoft.com/en-us/library/ms534706(VS.85).aspx

來源

2010-11-30 10:09:28

對於Wekbit（如Chrome和Safari），你可以添加：

else if (typeof target.style.webkitUserSelect != "undefined") // Webkit route 
    target.style.webkitUserSelect = "none";

對於IE瀏覽器，使用 '不可選擇'：

else if (typeof target.unselectable != "undefined") // IE route 
    target.unselectable = true;

參考：http://help.dottoro.com/ljrlukea.php

來源

2010-11-30 10:15:27 sje397

以上所有的例子都太複雜了..基於瀏覽器版本。我得到了simle解決方案...適用於所有瀏覽器！

// you can select here which html element you allow to be selected 
var ExcludeElems = ["INPUT","SELECT","OPTION"] 



function disableSelection (target) { 
    // For all browswers code will work ..... 
    target.onmousedown = function (e) 
    { 
    var i; 
    var e = e ? e : window.event; 

    if (e) 
     for (i=0; i<ExcludeElems.length;i++) 
     if (e.target.nodeName == ExcludeElems[i]) 
      return true; 
    return false; 
    }

如果您需要您可以使此功能更復雜。使用此代碼的任何容器元素...

disableSelection (document) 
//disableSelection (document.body) 
//disableSelection (divName) ....

來源

2014-02-24 21:27:10

Javascript非選擇性文本在Chrome/IE中不工作

回答

相關問題