テキストエリアのサイズ変更をオフにする

私のサイトでtextareaのサイズ変更をオフにしようとしています。現在、私はこの方法を使用しています：

.textarea {
    clear:left;
    min-width: 267px;
    max-width: 267px;
    min-height:150px;
    max-height:150px;
}

私の方法は正しくないことがわかっているので、JavaScriptでより良い方法を探しています。私は初心者なので、HTML5またはjQueryが最適です。

このCSSを試して、サイズ変更を無効にしてください

すべてのテキストエリアのサイズ変更を無効にするCSSは次のようになります。

textarea {
    resize: none;
}

代わりに、名前で単一のtextareaに割り当てることができます（textarea HTMLは）：

textarea[name=foo] {
    resize: none;
}

またはid（textarea HTMLが存在する場合）：

#foo {
    resize: none;
}

取得元：http : //www.electrictoolbox.com/disable-textarea-resizing-safari-chrome/

これはあなたの仕事をします

  textarea{
        resize:none;
    }

CSS3はこの問題を解決できます。残念ながら、現在使用されているブラウザの60％でのみサポートされています。

IEとiOSの場合、サイズ変更をオフにすることはできませんがtextarea、widthとを設定することでサイズを制限できますheight。

/* One can also turn on/off specific axis. Defaults to both on. */
textarea { resize:vertical; } /* none|horizontal|vertical|both */

デモを見る

htmlのドラッグ可能な属性を使用するだけで簡単にできます

<textarea name="mytextarea" draggable="false"></textarea>

デフォルト値はtrueです。

アプリケーションのすべてのテキストエリアのデフォルトの動作を元に戻したい場合は、CSSに次のオプションを追加できます。

textarea:not([resize="true"]) {
  resize: none !important;
}

次の操作を行って、サイズを変更する場所を有効にします。

<textarea resize="true"></textarea>

このソリューションは、サポートしたいすべてのブラウザーで機能しない可能性があることに注意してください。resizeここでサポートのリストを確認できます：http : //caniuse.com/#feat=css-resize

質問に従って、私は答えをjavascriptにリストしました

TagNameを選択して

document.getElementsByTagName('textarea')[0].style.resize = "none";

Idを選択して

document.getElementById('textArea').style.resize = "none";

//CSS:
.textarea {
    resize: none;
    min-width: //-> Integer number of pixels
    min-height: //-> Integer number of pixels
    max-width: //-> min-width
    max-height: //-> min-height
}

上記のコードはほとんどのブラウザで動作します

//HTML:
<textarea id='textarea' draggable='false'></textarea>

最大数のブラウザーで機能するように両方を実行する

これは私の作品です

<textarea
  type='text'
  style="resize: none"
>
Some text
</textarea>