入力テキストボックスの入力実装プロパティを無効にする

入力テキストボックスの入力実装プロパティを無効にする
今日は、開発でよく使われる、非常に便利な HTML タグをいくつかまとめてみたいと思います。これらのタグに馴染みのない人は、あまりよく知らないかもしれません。次のタグです。

コードをコピー
コードは次のとおりです。

読み取り専用、無効、オートコンプリート

readonly は、このフィールドの値を変更できないことを意味します。type="text" でのみ使用できます。コピー、選択、フォーカスの受け取りが可能です。背景に値が表示されます。

コードをコピー
コードは次のとおりです。

<input type="text" name="www.xxx" readonly="読み取り専用" />

disabled は、入力要素が無効であることを意味します。編集、コピー、選択、フォーカスの受け取りはできません。背景には値は届きません。

コードをコピー
コードは次のとおりです。

<input type="text" name="www.xxx.com" disabled="無効" />

CSS で入力方法をブロックすることもできます: <input style="ime-mode: disabled">
最後に、よく使われるタグを紹介します。ブラウザは通常、入力ボックスを記録しているので、入力すると、以下のように多くのコンテンツがドロップダウンすることがよくあります。
これを削除する場合は、autocomplete="off" を追加するのが最適です。使用方法は次のとおりです: autocomplete="off"

コードをコピー
コードは次のとおりです。

<input type="text" autocomplete="off" id="number"/>

<<:  Vue3 リストインターフェースデータ表示の詳細

>>:  MySQL に接続する際に Navicat for MySQL が 2005 エラーを報告する問題を解決する

推薦する

Linux 上の MySQL 5.7 でパスワードを忘れる問題を解決する

1. 問題Linux 上の mysql5.7 のパスワードを忘れました2. 解決策• ステップ 1:...

MySQLからClickHouseに移行する5つの方法

データ移行は、MySQL から ClickHouse にインポートする必要があります。概要プランは以...

Vueは移動可能なフローティングボタンを実装します

この記事の例では、どこにでも移動できるフローティングボタンを実現するためのVueの具体的なコードを共...

シェルスクリプトは、Docker の半自動コンパイル、パッケージ化、およびリリースアプリケーション操作を構築します。

Docker 公開方法は、DevOps (送信、コンパイル、パッケージ化、リリースなどの一連のイベ...

Linux での SSH 非秘密通信の実装

SSHとは何か管理者はリモートでログインして、インターネット経由で接続されたさまざまな場所にある複数...

VMware で VMware ツールをインストールしてもインストール ファイルが表示されない問題を解決する方法

VMware ツールは VMware の使用に非常に便利です。そのため、VMware ツールをインス...

CSSページ下部固定を実現する8つの方法の詳細な説明

ページを書いているときに、ページの内容が小さくてフッターがページの真ん中に留まってしまうといった状況...

複数の画像を切り替えるJavaScript

この記事では、複数の画像を切り替えるJavaScriptの具体的なコードを参考までに紹介します。具体...

WeChatアプレットコンポーネント開発:視覚的な映画座席選択機能

目次1. はじめに1. コンポーネントデータ2. コンポーネントページのレイアウト1. ロゴエリアの...

MySQLインデックスの詳細

1. インデックスの原則インデックスは、列内の特定の値を持つ行をすばやく見つけるために使用されます。...

MySQL の 6 つの一般的な制約タイプの詳細な説明

目次序文1.nullでない2. ユニーク3. デフォルト4.主キー自動増分主キー5. 外部キー6.チ...

jQuery ツリービュー ツリー構造アプリケーション

この記事では、jQueryツリービューツリー構造のアプリケーションコードを例として紹介します。具体的...

MySQLの数値型自動増分における落とし穴

テーブル構造を設計する場合、数値型は最も一般的な型の 1 つですが、数値型をうまく使用するのは想像す...

フレックスレイアウトとposition:absolute/fixedの競合の詳細な説明

以前、プロジェクトを開発しているときに、flex レイアウトと position:absolute/...

Webフロントエンド開発におけるエラーを見つけるための基本的な考え方

WEB開発は主に2つのインタラクション(B/Sデータ)から構成されますブラウザ: 1html、css...