6

divからのテキストのコピーを無効にする方法があるかどうか疑問に思いましたか?

私はウェブサイトに行ったことがありますが、テキストの一部を強調表示またはコピーしようとすると、それができません。私がこれをどのように達成するか誰かが知っているかどうか疑問に思いましたか?

<div id="description">However, this valorous visitation of a by-gone vexation,
 stands vivified and has vowed to vanquish these venal and virulent vermin
 vanguarding vice and vouchsafing the violently vicious and voracious violation
 of volition. </div>
4

3 に答える 3

12

CSSだけを使用すると、次のようにユーザー選択を使用できます。

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

これはFirefox、Chrome、Safari、IE10以降で機能しますが、Operaでは機能しません。

これは単にユーザーがテキストを選択するのを止めますが、それは彼らがそれをコピーするのを防ぎます。ボタンのテキストにも適しています。

古いIEおよびOperaでは、次のいずれかを使用して選択不可に設定できます。

var elem = document.getElementById("yourElement");
elem.unselectable = "on"; // For IE and Opera

JSで、または単にunselectable属性を追加してオンに設定します。

次に例を示します:http://jsfiddle.net/B9yYt/

于 2012-05-27T21:02:04.163 に答える
1

次のように、コンテンツの上にdivを追加できます。

<html>
<head>
<style>
#content{
    z-index: 0;
    background: grey;
}

#overlay{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
}

</style>
</head>
<body>

    <div id="content">
        <p>Can't touch this</p>
    </div>

    <div id="overlay">

    </div>

</body>
</html>
于 2012-05-27T20:57:22.447 に答える
0

JavaScriptではありませんが、CSSを使用して、選択に対して「表示」を無効にすることができます。

::-moz-selection { background: #000000; color: #ffffff; text-shadow: none; }
::selection { background: #000000; color: #ffffff; text-shadow: none; }

これはクロスブラウザ互換ではないことに注意してください。

于 2012-05-27T20:51:56.093 に答える