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

入力テキストボックスの入力実装プロパティを無効にする
今日は、開発でよく使われる、非常に便利な 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 エラーを報告する問題を解決する

推薦する

CocosCreator で http と WebSocket を使用する方法

目次1. HTTPGET 2. HTTP POSTウェブソケット4. Egretのhttpとwebs...

Momentsで写真を整理するためのCSSコード

まず、Moments を開いて、写真の数が異なるいくつかのレイアウトを確認するか、以下の例を参照して...

Docker で FastDFS ファイル システムを構築する (マルチイメージ チュートリアル)

目次FastDFSについて1. 画像を検索する2. イメージをインストールする3.1. 必要なディレ...

MySQL が InnoDB テーブルが独立したテーブルスペースか共有テーブルスペースかを判断する方法の詳細な説明

序文InnoDB はデータをテーブルスペースに保存します。デフォルト設定では、初期サイズが 10 M...

CSS3 で transform を使用した場合のフォントぼかしの解決方法の詳細な説明

この質問は非常に奇妙なので、あまり多くを語らずにコードに直接進みます。 .g-ダイアログラッパー{ ...

HTML タグ dl dt dd 使用方法

基本構造:コードをコピーコードは次のとおりです。 <ダウンロード> <dt>...

Java は Excel から MySQL にデータをインポートします

実際の業務では、Excel からデータベースにデータをインポートする必要がある場合があります。データ...

MySQLのクラスタモードでのgalera-clusterのデプロイメントの詳細説明

目次1: galera-clusterの紹介2. galera-clusterの仕組み3: Mari...

VMware Workstation16 と Navicat リモート接続での Centos7 での MySQL8.0 インストール プロセス

目次1. CentOS7+MySQL8.0、yumソースインストール2. MySQLにログインしてパ...

MySQL データベースを手動および自動でバックアップする 8 つの方法

MySQL は人気のオープンソースデータベース管理システムとして多くのユーザーが利用しています。デー...

Vue+flaskで動画合成機能を実現(ドラッグ&ドロップアップロード)

目次ドラッグアンドドロップアップロードについては以前の記事で書きました。ファイルをアップロードするF...

mysql-connector-java.jar パッケージのダウンロード プロセスの詳細な説明

mysql-connector-java.jar パッケージのチュートリアルをダウンロードします: ...

jQuery タグセレクターの適用例の詳細な説明

この記事では、jQueryタグセレクターアプリケーションの具体的なコードを例として紹介します。具体的...

仮想マシンUbuntu 16.04がインターネットに接続できない問題の解決策

Ubuntu をインストールしたばかりですが、開いたときにネットワーク接続がありませんでした。右上隅...

Linux ファイアウォール設定の詳細な手順 (yum ウェアハウス設定に基づく)

序文この実験では、デバッグ用に2つの仮想マシン(CentOs6とRed Hat 6)を準備します。 ...