HTML ページでテキストが選択されないようにするにはどうすればよいですか?-CSSチュートリアル-php.cn

HTML ページでテキストが選択されないようにするにはどうすればよいですか?

Patricia Arquette

リリース： 2024-12-29 13:20:10

オリジナル

507 人が閲覧しました

How Can I Prevent Text Selection on My HTML Pages?

HTML ページでのテキスト選択の防止

質問:

UI を強化するにはHTML ページ、意図しない誤操作を避けるためにタブ名のようなテキスト要素を選択不可にするにはどうすればよいですかハイライト?

CSS/HTML 解決策:

ほとんどのブラウザーでは、次の CSS を適用できます:

*.unselectable {
   -moz-user-select: -moz-none;
   -khtml-user-select: none;
   -webkit-user-select: none;

   -ms-user-select: none;
   user-select: none;
}

ログイン後にコピー

そうでない要素にはIE < などでこのプロパティを継承します。 10 および Opera では、選択不可能な属性を目的の要素に直接追加できます:

<div>

ログイン後にコピー

JavaScript ソリューション:

選択不可能な属性を手動で追加する再帰的な代替手段としてコンテナ内の各要素に対して JavaScript を使用できます:

function makeUnselectable(node) {
    if (node.nodeType == 1) {
        node.setAttribute("unselectable", "on");
    }
    var child = node.firstChild;
    while (child) {
        makeUnselectable(child);
        child = child.nextSibling;
    }
}

makeUnselectable(document.getElementById("foo"));

ログイン後にコピー

以上がHTML ページでテキストが選択されないようにするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。