ホームページ ウェブフロントエンド jsチュートリアル 携帯電話登録時に認証コードを送信するカウントダウン機能

携帯電話登録時に認証コードを送信するカウントダウン機能

Dec 21, 2017 am 10:03 AM
秒読み 送信 確認する

多くの場合、何を登録する場合でも確認コードがあり、カウントダウン機能もあります。この記事の編集者は、携帯電話登録の場合に確認コードのカウントダウンを送信する方法の簡単な例を紹介します。 。非常に参考になるので、編集者をフォローして他の人の参考になれば幸いです。

は次のとおりです:

()这里用的是input做的点击发送验证码
<input type="number" class="input" name="mobile" placeholder="手机号" style="border: none"

<input class="hui_kuang"style="width: 30%;text-align: center;height: 42px"onclick="setTime(this)" value=&#39;获取验证码&#39;>
<script>
  
//页面初始化获取倒计时数字(避免在倒计时时用户刷新浏览器导致倒计时归零)
 var $getCodeInput = $(".hui_kuang");
 var sessionCountdown = sessionStorage.getItem("countdown");
 if (!sessionCountdown) {
  $(".hui_kuang").val("获取验证码")
 } else {
  $(".hui_kuang").val("重新发送(" + sessionCountdown + ")");
  setCode($getCodeInput, sessionCountdown);
 }
 //获取验证码
 function setTime() {
  var remobile = $("#registForm input[name=&#39;mobile&#39;]").val();
  if (!remobile) {
   alert("请输入手机号码")
   return;

  }
  if (!(/^1[3|4|5|8][0-9]\d{4,8}$/.test(remobile))) {
   alert("请输入有效的手机号码")
   return;
  } else {
   setCode($getCodeInput, 60);
  }

 }
 //发送验证码倒计时
 function setCode($getCodeInput, countdown) {
  if (countdown == 0) {
   $getCodeInput.attr(&#39;disabled&#39;, false);
//   $getCodeInput.removeAttribute("disabled");
   $getCodeInput.val("获取验证码");
   sessionStorage.removeItem("countdown");
   return;
  } else {
   $getCodeInput.attr(&#39;disabled&#39;, true);
   $getCodeInput.val("重新发送(" + countdown + ")");
   countdown--;
  }
  sessionStorage.setItem("countdown", countdown);
  window.setTimeout(function () {
   setCode($getCodeInput, countdown);
  }, 1000);
 }
</script>
ログイン後にコピー

皆さんは学びましたか?考え方は同じなので、皆さんのお役に立てれば幸いです。

関連する推奨事項:

phpを使用してSMS認証コードを送信する方法

Thinkphp認証コードログイン関数の実装例

認証コードを実装するJSメソッド

以上が携帯電話登録時に認証コードを送信するカウントダウン機能の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

PDFの署名を検証する方法 PDFの署名を検証する方法 Feb 18, 2024 pm 05:33 PM

私たちは通常、政府やその他の機関から PDF ファイルを受け取りますが、中にはデジタル署名が付いているものもあります。署名を検証すると、SignatureValid メッセージと緑色のチェック マークが表示されます。署名が検証されない場合、有効性は不明です。署名の検証は重要です。PDF で署名を検証する方法を見てみましょう。 PDF 形式の署名を検証する方法 PDF 形式で署名を検証すると、署名の信頼性が高まり、文書が受け入れられる可能性が高くなります。次の方法で PDF ドキュメントの署名を検証できます。 Adobe Reader で PDF を開きます。 署名を右クリックし、「署名プロパティの表示」を選択します。 「署名者証明書の表示」ボタンをクリックします。 「信頼」タブから信頼できる証明書リストに署名を追加します。 「署名の検証」をクリックして検証を完了します。

C++ で簡単なカウントダウン プログラムを作成するにはどうすればよいですか? C++ で簡単なカウントダウン プログラムを作成するにはどうすればよいですか? Nov 03, 2023 pm 01:39 PM

C++ は広く使用されているプログラミング言語で、カウントダウン プログラムを作成するのに非常に便利で実用的です。カウントダウン プログラムは、非常に正確な時間計算とカウントダウン機能を提供する一般的なアプリケーションです。この記事では、C++ を使用して簡単なカウントダウン プログラムを作成する方法を紹介します。カウントダウン プログラムを実装する鍵は、タイマーを使用して時間の経過を計算することです。 C++ では、time.h ヘッダー ファイル内の関数を使用してタイマー関数を実装できます。以下は、単純なカウントダウン プログラムのコードです。

WeChatの友人による認証を使用してブロックを解除する詳細な方法 WeChatの友人による認証を使用してブロックを解除する詳細な方法 Mar 25, 2024 pm 01:26 PM

1. WeChatを開いた後、検索アイコンをクリックし、WeChatチームと入力し、下のサービスをクリックして入力します。 2. 入力後、左下隅にあるセルフサービス ツール オプションをクリックします。 3. をクリックした後、上のオプションで、補助検証のブロック解除/再審査請求のオプションをクリックします。

TikTokで他の人にファイルを送信するにはどうすればよいですか?他の人に送信したファイルを削除するにはどうすればよいですか? TikTokで他の人にファイルを送信するにはどうすればよいですか?他の人に送信したファイルを削除するにはどうすればよいですか? Mar 22, 2024 am 08:30 AM

Douyin では、ユーザーは自分の人生の詳細や才能を共有するだけでなく、他のユーザーと交流することもできます。このプロセスでは、写真やビデオなどのファイルを他のユーザーに送信する必要がある場合があります。では、Douyin で他の人にファイルを送信するにはどうすればよいでしょうか? 1.Douyin で他の人にファイルを送信するにはどうすればよいですか? 1. Douyin を開き、ファイルを送信するチャット インターフェイスに入ります。 2. チャット インターフェイスの「+」記号をクリックし、「ファイル」を選択します。 3. ファイル オプションで、写真、ビデオ、オーディオ、その他のファイルの送信を選択できます。送信したいファイルを選択後、「送信」をクリックします。 4. 相手がファイルを受け入れるまで待ちます。相手がそれを受け入れると、ファイルは正常に転送されます。 2.Douyin で他の人に送信したファイルを削除するにはどうすればよいですか? 1. Douyin を開き、送信したテキストを入力します。

Vue を使用してボタンのカウントダウン効果を実装する方法 Vue を使用してボタンのカウントダウン効果を実装する方法 Sep 21, 2023 pm 02:03 PM

Vue を使用してボタンのカウントダウン効果を実装する方法 Web アプリケーションの人気が高まるにつれて、ユーザーがページを操作するときのユーザー エクスペリエンスを向上させるために、動的効果を使用する必要がよくあります。その中でもボタンのカウントダウンエフェクトは非常に一般的で実用的なエフェクトです。この記事では、Vue フレームワークを使用してボタンのカウントダウン効果を実装する方法と、具体的なコード例を紹介します。まず、ボタンとカウントダウン関数を含む Vue コンポーネントを作成する必要があります。 Vue では、コンポーネントは再利用可能な Vue インスタンスであり、ビューは

WhatsApp のヒント: HD 写真とビデオを送信する方法 WhatsApp のヒント: HD 写真とビデオを送信する方法 Sep 10, 2023 am 10:13 AM

WhatsApp は、ユーザーがメッセージング プラットフォームを通じて写真やビデオを高解像度で送信できる新しいオプションを開始しました。それがどのように行われるかを知るために読んでください。 WhatsApp は、iPhone と Android ユーザーが高解像度で写真やビデオを送信できるようにするアップデートをリリースし、ついにサービスの低品質メディア共有制限に対処しました。このオプションは「HD 品質」と呼ばれ、ユーザーが最小限の圧縮でより鮮明な写真やビデオを送信できることを意味します。たとえば、iPhone でキャプチャした画像は、以前の最大解像度 920x1280 ではなく 3024x4032 で送信できるようになり、ビデオは 848x476 ではなく 1280x718 解像度で送信できるようになりました。

正規表現を使用して IFSC コードを検証するにはどうすればよいですか? 正規表現を使用して IFSC コードを検証するにはどうすればよいですか? Aug 26, 2023 pm 10:17 PM

Indian Financial System Code の略称です。電子資金移動システムに参加しているインドの銀行支店は、特別な 11 文字のコードで識別されます。インド準備銀行は、インターネット取引でこのコードを使用して銀行間で資金を送金します。 IFSC コードは 2 つの部分に分かれています。銀行は最初の 4 文字で識別され、支店は最後の 6 文字で識別されます。 NEFT (National Electronic Funds Transfer)、RTGS (Real Time Gross Settlement)、および IMPS (Immediate Payment Service) は、IFSC コードを必要とする電子トランザクションの一部です。方法 正規表現を使用して IFSC コードを検証する一般的な方法は次のとおりです。 長さが正しいかどうかを確認します。最初の 4 文字を確認してください。 5 番目の文字を確認してください。Che

PHP 8 の新機能: 検証と署名の追加 PHP 8 の新機能: 検証と署名の追加 Mar 27, 2024 am 08:21 AM

PHP8 は PHP の最新バージョンであり、プログラマーにさらなる利便性と機能をもたらします。このバージョンはセキュリティとパフォーマンスに特に重点を置いており、注目すべき新機能の 1 つは検証および署名機能の追加です。この記事では、これらの新機能とその使用法について詳しく説明します。検証と署名は、コンピューター サイエンスにおける非常に重要なセキュリティ概念です。これらは、送信されるデータが完全で本物であることを確認するためによく使用されます。オンライン取引や機密情報を扱う場合、検証と署名がさらに重要になります。誰かがデータを改ざんできると、潜在的にデータが改ざんされる可能性があるためです。

See all articles