入力タイプとは何を意味し、入力を制限する方法
|
入力を制限する一般的な方法 1. ボタンが押されたときに点線のボックスを消すには、入力に属性値hideFocusまたはHideFocus=trueを追加します。 コードをコピー コードは次のとおりです。<input type="submit" value="送信" hidefocus="true" /> 2. テキストボックスの内容のみを読み取るには、入力に属性値readonlyを追加します。 コードをコピー コードは次のとおりです。<input type="text" 読み取り専用 /> 3. 戻った後にTEXTドキュメントがクリアされないようにする（スタイルコンテンツをクラス参照として使用できます） コードをコピー コードは次のとおりです。<input type="text" style="behavior:url(#default#savehistory);" /> 4. ENTERキーを押すとカーソルが次の入力ボックスに移動します。 コードをコピー コードは次のとおりです。<input type="text" onkeydown="if(event.keyCode==13)event.keyCode=9" /> 5. 中国語のみ（点滅） コードをコピー コードは次のとおりです。<input type="text" onkeyup="value=value.replace(/[ -~]/g,'')" onkeydown="if(event.keyCode==13)event.keyCode=9" /> 6. 数字のみ（点滅） コードをコピー コードは次のとおりです。<input type="text" onkeyup="value=value.replace(/[^\d]/g,'') " onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))" /> 7. 数字のみ（点滅なし） コードをコピー コードは次のとおりです。<input type="text" style="ime-mode:disabled" onkeydown="if(event.keyCode==13)event.keyCode=9" onkeypress="if ((event.keyCode<48 || event.keyCode>57)) event.returnValue=false" /> 8. 英語と数字のみ入力可能（点滅） コードをコピー コードは次のとおりです。<input type="text" onkeyup="value=value.replace(/[\W]/g,'')" onbeforepaste="clipboardData.setData('text',clipboardData.getData('text').replace(/[^\d]/g,''))" /> 9. ブロック入力方式 コードをコピー コードは次のとおりです。<input type="text" name="url" style="ime-mode: disabled" onkeydown="if(event.keyCode==13)event.keyCode=9" /> 10. 数字、小数点、マイナス記号（-）のみ入力できます（点滅なし） コードをコピー コードは次のとおりです。<input onkeypress="if (event.keyCode!=46 && event.keyCode!=45 && (event.keyCode<48 || event.keyCode>57)) event.returnValue=false" /> 11. 小数点以下2桁または3桁のみ入力可能（点滅） コードをコピー コードは次のとおりです。<input type="text" maxlength="9" onkeyup="if(value.match(/^\d{3}$/))value=value.replace(value,parseInt(value/10)) ;value=value.replace(/\.\d*\./g,'.')" onkeypress="if((event.keyCode<48 || event.keyCode>57) && event.keyCode!=46 && event.keyCode!=45 || value.match(/^\d{3}$/) || /\.\d{3}$/.test(value)) {event.returnValue=false}" /> |
>>: CSSは、他のレイヤーを変更せずに、多層ネスト構造の最外層を回転させる効果を実現します。
推薦する
JavaScriptの擬似配列と配列の使い方と違い
擬似配列と配列JavaScript では、5 つのプリミティブ データ型を除き、関数を含め、その他す...
ネイティブ JS を使用してタッチスライド監視イベントを実装する方法
序文今日はちょっとしたデモを書きました。左右にスワイプするロジックに関わる部分があります。当初はプラ...
Zabbix は DingTalk のアラーム機能を画像付きで設定します
実装のアイデア:まず、アラーム情報にはitemidが必要です。これは前提条件です。情報に渡されるパラ...
HTML テーブル マークアップ チュートリアル (22): 行の境界線の色属性 BORDERCOLORLIGHT
行内では、明るい境界線の色を個別に定義できます。基本的な構文<TR ボーダーカラーライト=co...
各グループの最新データを取得するためにMySQLベースのグループを実装する
序文：グループ化関数はグループ内の最初のデータを取得しますが、各グループ内の最新のデータを取得する必...
MySQL 8.0 の新機能 - 管理ポートの使用の概要
目次序文接続管理追加の接続管理ポート要約する序文皆さんの多くは、次のようなエラー メッセージに遭遇し...
Nginx Rewriteモジュールを使用するいくつかのシナリオ
アプリケーションシナリオ1: ドメイン名ベースのリダイレクト会社の古いドメイン名は www.accp...
Vue コンポーネントでのアンチシェイクとスロットリングの使用例の分析
入力ボックスへのユーザー入力、ウィンドウのサイズ変更、スクロール、Intersection Obse...
html2canvas を使用して HTML コードを画像に変換する方法
コードを画像に変換するにはhtml2canvas は、ブラウザから Web ページのスクリーンショッ...
JavaScript 高度なカスタム例外
目次1. コンセプト1.1 エラーと例外とは何ですか? 1.2 異常の分類2. 例外処理2.1try...
Vue3 Vue CLI マルチ環境設定
目次1. はじめに2. 切り替え1. 開発および本番環境の設定ファイルを追加する2. 複数の環境をサ...
Centos7 での MySQL 5.7.20 のインストールと設定に関する詳細なチュートリアル
1. 公式 Web サイトから MySQL 5.7 インストール パッケージ (mysql-5.7....
初心者がソースコードからMySQLのデッドロック問題を理解する
夜遅くまで何度も困難なシングルステップデバッグを行った後、ようやく理想的なブレークポイントを見つけま...
ウェブサイトのユーザーエクスペリエンスデザイン（UE）
Google Reader で、JunChen が書いた「フロー理論と設計」というタイトルの投稿を見...
SQLと各種NoSQLデータベースの使用シナリオの説明
SQL はメイントランクです。なぜ私はこのように理解するのでしょうか。技術的な観点からリレーショナル...