JavaScriptは、ユーザーがチェックボックスをオンにする必要があるプロトコルの例を実装します。

JavaScriptは、ユーザーがチェックボックスをオンにする必要があるプロトコルの例を実装します。

js では、ログインまたは登録を確認する前に、ユーザーが特定の契約書を読むように設定します (使用スキルが無効)

2 枚の写真をよく見ると、丸で囲んだ部分が異なっていることがわかります。

スクロールホイールが上にある場合、下のフォームは選択できません

一番下の2番目のシートはオプションです


ここに画像の説明を挿入ここに画像の説明を挿入

方法は、スクロールホイールを監視することです。スクロールホイールが下まで達すると、フォームが選択可能になります。

info.scrollHeight - info.scrollTop == info.clientHeight //スクロールバーが下端に達したかどうかを判断します
<!DOCTYPE html>
<html>
	<ヘッド>
		<メタ文字セット="utf-8">
		<スタイル タイプ="text/css">
			#情報{
				幅: 200ピクセル;
				高さ: 500px;
				背景色: #00FFFF;
				オーバーフロー:自動;
			}
		</スタイル>
		<script type="text/javascript">
			window.onload = 関数(){
				/*
				 *フォーム項目は、垂直スクロールバーが下まで達すると使用可能になります * onscroll
				 * このイベントはスクロールバーがスクロールしたときにトリガーされます	
				 * */ 
				 var info = document.getElementById("info");
				 var inputs = document.getElementsByTagName("input");
				 info.onscroll = 関数(){
					//スクロールバーが下までスクロールしたかどうかを確認します if(info.scrollHeight - info.scrollTop == info.clientHeight){
						//バーを一番下までスクロールするとフォーム項目が使用可能になります inputs[0].disabled = false;
						入力[1].disabled = false;
					}
				 }
			}
		</スクリプト>
		<タイトル></タイトル>
	</head>
	<本文>
		<h1>新規ユーザーの登録を歓迎します</h1>
		: : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : : :
		<input type="checkbox" name="" id="" value="" disabled="disabled"/>契約内容をよく読み、それに従います <input type="submit" value="登録" disabled="disabled"/><!-- フォームに disabled="disabled" を追加すると、フォーム項目は使用できなくなります -->
	</本文>
</html>

この方法はChromeには適用されませんが、他のブラウザでは適用できます。

これで、JavaScript でユーザーが確認する必要があるプロトコルを実装する例に関するこの記事は終了です。JavaScript でユーザーが確認する必要があるプロトコルを実装する方法に関するより関連性の高いコンテンツについては、123WORDPRESS.COM で以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません:
  • JavaScript はフロントエンド Web ページでカウントダウンを実装します
  • JavaScript の for ループと二重 for ループの詳細な説明
  • 画像のプリロードと遅延ロードを実装するJavaScript
  • JavaScript 配列を走査する 5 つの方法
  • JavaScript クラス配列の詳細な理解

<<:  cmd と python での MySQL の一般的な操作についての簡単な説明

>>:  Linux カーネル デバイス ドライバー 高度な文字デバイス ドライバーのメモ

推薦する

CSS 水平方向の中央揃えと最大幅の制限

CSS レイアウトとスタイルに関する質問: 水平方向の中央揃えと最大幅の制限のバランスをとる方法最近...

iviewは動的なフォームとカスタム検証期間の重複を実装します

フォーム項目を動的に追加するiview の動的なフォーム追加は非常に簡単です。フォーム項目を配列に設...

Docker Docker の保存場所を変更する コンテナイメージのサイズ制限を変更する操作

これは新しいバージョンではもう不可能なようで、推奨されません。そうでない場合は、ソフト リンクを直接...

最も単純な ErrorBoundary コンポーネントをカプセル化して、React 例外を処理する

序文React 16から、子コンポーネントで発生したエラーを捕捉し、エラーログを記録し、ダウングレー...

React tsx はランダムな検証コードを生成します

React tsxは参照用にランダムな検証コードを生成します。具体的な内容は次のとおりです。最近、t...

MySQL テーブルタイプ ストレージエンジンの選択

目次1. 現在のデータベース支出のストレージエンジンを表示する方法1:方法2: 2. ENGINE=...

Tkinterはjsキャンバスを使用してグラデーションカラーを実現します

目次1. RGBを使用して色を表す2. Tkinter キャンバスコンポーネント3. グラデーション...

HTML と CSS の基礎 (必読)

(1) HTML: ハイパーテキストマークアップ言語。主に「ヘッダー」と「ボディ」の2つの部分で構...

リモートDockerを使用した統合テスト環境の構築手順

需要背景チームには統合テストが必要であり、そのためには、mysql や rabbitmq などのミド...

Linux で docker-compose を使用したソフトウェア構成の詳細な説明

序文この記事では、docker-compose の構成をいくつか紹介します。これらを参考にして、独自...

データ型の判断における js typeof と instanceof の違いと、その開発と使用について

目次1. typeof演算子2. インスタンスオブ演算子3. typeof と instanceof...

セマフォによるTomcatの異常終了の解決方法

最近はビッグデータで遊んでいます。友人が私のところに来て、オンラインの Tomcat が不可解に終了...

ReactのuseEffectクロージャの落とし穴についての簡単な説明

問題コードuseEffectによって発生したクロージャの問題コードを見てみましょう 定数 btn =...

Reactは複雑な検索フォームの展開と折りたたみ機能を実装します

時間に余裕を持って、過去を忘れましょう。前のセクションでは、[検索] フォームとクエリおよびリセット...

HTML ヘッド構造

以下では、よく使われるヘッド構造と、各タグや要素の意味や使用シーンを紹介します(この記事は、Yisi...