入力タイプとは何を意味し、入力を制限する方法
|
入力を制限する一般的な方法 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は、他のレイヤーを変更せずに、多層ネスト構造の最外層を回転させる効果を実現します。
推薦する
HTML でテキストの折り返しを実装する例 (HTML でテキストと画像が混在)
1. 画像の周りのテキスト通常のものを使用する場合、たとえば次のようになります。コードをコピーコー...
Nginx ローカル ディレクトリ マッピング実装コード例
他のデバイスの画像をローカルディレクトリにマウントするなど、サーバー上の静的リソースにアクセスする必...
WEB中国語フォントアプリケーションガイド
Web 上でフォントを使用することは、基本的なスキルであると同時に芸術でもあります。英語のフォントに...
負の距離（共感） - 相互影響の反復プロセス
ネガティブな距離は共感を意味します。序文（疑問の提起）：プロダクトマネージャーは機能を把握します。機...
Linux システム AutoFs 自動マウント サービスのインストールと構成
目次序文1. サービスプログラムをインストールする2. メイン設定ファイルを書く3. サブ構成ファイ...
使用場所によって混乱しやすいXHTMLタグ
<br />jb51.net では、常に記事のセマンティクスを重視してきましたが、HTM...
Docker がデータベースのデプロイに適さない 7 つの理由のまとめ
Docker は過去 2 年間で非常に人気が高まっています。開発者はすべてのアプリケーションとソフト...
awk でのループの使用
同じコマンドを複数回実行するさまざまな種類のループについて学習しましょう。 awk スクリプトには、...
Vue 2つのフィールドの共同検証によりパスワード変更機能を実現
目次1. はじめに2. ソリューションの実装2.1 実装コード2.2 コードの説明2.3 検証結果1...
浮遊要素によって引き起こされる問題と解決策の詳細な説明
1. 問題複数のフローティング要素は親要素の幅を拡張できず、親要素の高さが 0 になる可能性がありま...
Vueウォッチの監視方法の概要
目次1. Vueにおけるwatchの役割はその名の通り、監視の役割です。 2. このオブジェクトのプ...
CSS3 カテゴリメニュー効果
CSS3 カテゴリ メニューの効果は次のとおりです。 html <html> <ヘ...
HTMLヘッダータグの使用に関する詳細な説明
HTMLはヘッドとボディの2つの部分で構成されています** ヘッド内のタグはヘッドタグです** タイ...
Jenkins を通じて None のイメージを定期的にクリーンアップする方法
序文継続的なコード配信のプロセスで、Jenkins を利用して Docker イメージを作成すると、...
MySQL 8.0.13 zipパッケージのインストール方法について
MySQL 8.0.13 にはデフォルトでデータ フォルダがあります。このフォルダを削除する必要があ...