クリックして認証コードと認証を切り替えるJavaScript
|
この記事では、クリックして切り替える認証コードと認証を実装するためのJavaScriptの具体的なコードを参考までに共有します。具体的な内容は次のとおりです。 効果：
コード：
<!DOCTYPE html>
<html>
<ヘッド>
<メタ文字セット="UTF-8">
<タイトル></タイトル>
<スタイル>
div {
幅: 100ピクセル;
高さ: 40px;
背景色: 赤;
色: #fff;
テキスト配置: 中央;
行の高さ: 40px;
フォントサイズ: 30px;
フォントの太さ: 900;
ユーザー選択: なし;
}
。見せる {
位置: 絶対;
左: 0;
上: 0;
右: 0;
下部: 0;
マージン: 自動;
幅: 200ピクセル;
高さ: 100px;
背景色: ピンク;
テキスト配置: 中央;
行の高さ: 100px;
フォントサイズ: 40px;
フォントの太さ: 900;
表示: なし;
}
</スタイル>
</head>
<本文>
<div></div>
<input type="text" value="上記の確認コードを入力してください" />
<button>登録</button>
<div class="show">待っています。 。 。 。 </div>
<script type="text/javascript">
//1000-9999
タグ名によって要素を取得します。
var inp = document.getElementsByTagName("input")[0];
var btn = document.getElementsByTagName("ボタン")[0];
div[0].innerHTML = ranFun(1000, 9999);
inp.onclick = 関数（）{
this.value = ""
}
div[0].onclick = 関数（）{
this.innerHTML = ranFun(1000, 9999)
}
btn.onclick = 関数（）{
inp.value == div[0].innerHTMLの場合{
div[1].style.display = "ブロック";
setTimeout(関数() {
location.href = "register.html"
}, 3000)
} それ以外 {
アラート('認証コードエラー')
div[0].innerHTML = ranFun(1000, 9999);
inp.value = ""
}
}
関数 ranFun(a, b) {
Math.floor(Math.random() * (b - a + 1) + a) を返します。
}
</スクリプト>
</本文>
</html>以上がこの記事の全内容です。皆様の勉強のお役に立てれば幸いです。また、123WORDPRESS.COM を応援していただければ幸いです。 以下もご興味があるかもしれません:
|
<<: 雨滴効果を実現する JavaScript キャンバス
推薦する
ラベルとボタンを削除し、背景画像の点線/影を追加すると完璧な解決策になります
ユーザーが登録すると、ラベルをクリックして確認コードを変更します。クリックするとラベルに影の部分がで...
CSS を使用して物流の進行状況のスタイルを実装するためのサンプルコード
効果： CSS スタイル: <スタイル タイプ="text/css">...
Vueエンジニアがカプセル化しなければならない埋め込み命令の知識のまとめ
目次序文指導の基本フック機能フック関数のパラメータ文章使い方とアイデア成し遂げる汎用性を高める要約す...
Typescriptを使用してWeChatミニプログラムを開発するための詳細な手順
Typescript の利点については詳しく説明する必要はありません。ご興味があれば、(https:...
MYSQL（電話番号、IDカード）データ非感応化の実装
1. データ感度低下の説明日常の開発ニーズでは、データの感度低下が頻繁に発生します。たとえば、ID ...
MySQL マスタースレーブレプリケーションの実践の詳細説明 - GTID ベースのレプリケーション
GTIDベースのレプリケーション導入GTID ベースのレプリケーションは、MySQL 5.6 以降に...
MySQLでカンマ区切り値の列を列に変換する方法
序文場合によっては、第 1 正規形設計パターンに従わないビジネス テーブルに遭遇することがあります。...
MySQL 5.7 でルートパスワードを変更する方法に関するチュートリアル
バージョンアップデートにより、元のユーザーのパスワードフィールドがauthentication_st...
ボタンをクリックして画像を切り替える JavaScript
この記事の例では、ボタンをクリックすることで画像を切り替えることを実現するJavaScriptの具体...
MySQL がデュアルマスターで構成されている場合にデータループの競合を回避する方法
あなたはこの質問について考えたことがあるでしょうか?デュアルアクティブが構成されている場合、データル...
reduxの動作原理と使い方の説明
目次1. redux とは何ですか? 2. 還元の原則3. redux の使い方は？ （1）redu...
入力ボックスの値を取得する方法のReactの例
入力ボックスの値を取得する複数の方法最初の方法は、制御されていないコンポーネントの取得です2番目の方...
Red Hat Enterprise Linux 8 をベースにした CentOS 8 が正式にリリースされました
CentOS プロジェクトは、Red Hat の再配布要件に完全に準拠した、Red Hat Ente...
HTML テーブル マークアップ チュートリアル (38): ヘッダーの境界線の色属性 BORDERCOLOR
テーブルを美しくするために、ヘッダーに異なる境界線の色を設定できます。基本的な構文<TH 境界...
MySQL スケジュールされたデータベース バックアップ操作の例
この記事では、MySQL のスケジュールされたデータベース バックアップ操作の例について説明します。...