テキストエリアのテキスト選択を無効にする

Question

ユーザーがテキストエリア内のテキストを選択できないようにする方法を見つける必要があります。 目的は、テキストエリアにテキストを入力するためのカスタムキーボードを作成することです。私は、ユーザーがテキストエリアをクリックしてキャレットの位置を設定できるようにしたいと考えています。しかし、私は、ユーザーが挿入されたテキストの特定の部分を選択できるようにしたくない、または少なくともこれを視覚的に示す必要はありません。 私はすでに次のようなCSSを試してみましたが、成功しませんでした。

textarea { 
    -moz-user-select: none; 
    -webkit-user-select: none; 
    -khtml-user-select: none; 
    user-select: none; 
} 

解決策は、CSSまたはJavaScriptで行うことができ、Google Chromeでのみ動作する必要があります。 ありがとう！

UPDATE：

私のために動作しませんテキストエリアを無効にします。私が言及したように、ユーザーはその場所をクリックすることで特定の位置にキャレットを置くことができます。私がテキストエリアを無効にすると、この機能は失われます。

@OPUS：このソリューションはテキストエリアでは機能しません。 @Pointi：キーボードイベントをブロックすることができます。ユーザーはキーボードでテキストを入力する必要はありませんが、私がそのページに提供するカスタムキーボードを使用しています。画面上のキーボードと比較してください。 @downvoters：この質問についてはどうして悪いですか？

Answer 1

<textarea unselectable="on" id="my_textarea"></textarea> 

    *.unselectable { 
    -webkit-user-select: none; 
    } 

Answer 2

あなたはjavascriptでそれを無効にすることができます

document.getElementById("textarea").disable='true'; 

Answer 3

<textarea disabled="readonly"></textarea> 

は、それが働いているテスト。

Answer 4

"readonly"プロパティと "user-select"プロパティの組み合わせが機能します。

第2のルールでは、視覚的な選択の一種である選択時に強調表示された枠線を無効にします。

「選択不可能な」プロパティはOpera/IE固有のようです。

スタイル：

.noselect { 
    cursor: default; 
    -webkit-user-select: none; 
    -webkit-touch-callout: none; 
    -khtml-user-select: none; 
    -moz-user-select: none; 
    -ms-user-select: none; 
    -o-user-select: none; 
} 

.noselect:focus { 
    outline: none; 
} 

マークアップ：

<textarea class="noselect" readonly="readonly" unselectable="on"></textarea> 

読み取り専用（1まだクリックイベント時に、JSで切り替えることができます）無効よりも適している可能性があります。

Answer 5

それとも、ちょうどこのように、テキストエリア内= "無効" 無効に置くことができますコードの下

<textarea disabled="disabled"></textarea>

Answer 6

はあなたを助けることができる

JSコード：

$(document).ready(function(){ 
    $('#txtInput').bind("cut copy paste",function(e) { 
     e.preventDefault(); 
    }); 
});