コミュニティ 学ぶ ツールライブラリ レジャー
検索
日本語
ホームページ > ウェブフロントエンド > jsチュートリアル > JS が検証コードをランダムに生成する方法のコード共有例

JS が検証コードをランダムに生成する方法のコード共有例

黄舟
リリース： 2017-06-01 09:14:47
オリジナル
2206 人が閲覧しました

この記事では主にjs認証コードをランダムに生成する具体的な方法を詳しく紹介しますので、興味のある方は参考にしてください

私がこれまでに出会った認証コードはすべて

です。 、今日、js を使用してランダムな確認コードを生成するデモを見つけました。試して共有します。

効果:

html コード: 

<p>验证码：</p>
 <p id="login" onclick="change()">
  <a href="#" rel="external nofollow" ></a>
 </p>
ログイン後にコピー

はクリック イベント

を p に設定します。js コードは次のとおりです: 

 function getCode(n) {
  var all = "azxcvbnmsdfghjklqwertyuiopZXCVBNMASDFGHJKLQWERTYUIOP0123456789";
  var b = "";
  for (var i = 0; i < n; i++) {
   var index = Math.floor(Math.random() * 62);
   b += all.charAt(index);

  }
  return b;
 };

 function change() {
  document.getElementById("login").innerHTML = getCode(4);

 }
 window.onload = change;
ログイン後にコピー

変数

を定義し、その値を 26 文字と 0 ～ 9 10 にします数字。

Math.random()

を使用すると、システムは 0.0 以上 1.0 未満の疑似乱数の double 値をランダムに選択できます。 例: Math.random()*62 得られる値:

Math.floor

は、以前のブログでも触れた数値を切り捨てています。

charAt

メソッドは指定された位置の文字を返すことができます。これについては以前ブログで説明しました。 これらはすでによく知られているものなので、

レビュー

として考えてください。 4 つの乱数を取得し、それらを p タグに結合します。望ましい効果が得られます。

以上がJS が検証コードをランダムに生成する方法のコード共有例の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル：
JS，验证码
ソース：php.cn
前の記事：angularJs が $watch と $filter を使用して検索フィルターを作成する方法を共有するサンプル コード。 次の記事：ディザリング効果を実現するための JS の簡単なサンプル コード共有
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
非表示のサイドパネルを表示: チェックが入っています アニメーション化されたハンバーガー メニューを介してビューに切り替える機能を備えたナビゲーション メニューをサイド パネルに追加したいと考えています。 JSを使わずにCSSだけで作...
から 2024-04-06 15:49:33
0
1
319
v-model の電子メール値をメソッドに渡します こんにちは。入力に v-model を渡して電子メールを送信して検証をリセットしようとしていますが、入力から sendPasswordResetEmail に正しく渡す方法がわかり...
から 2024-04-05 10:04:40
0
1
405
現在の認証者以外の誰からでもブラウザ通知を受け取ります。ユーザー 私は現在 ReactJS を使用してチャット アプリケーションを構築していますが、ここ 2 日間この問題に悩まされてきました。新しいメッセージがあるたびにブラウザに通知が表示される...
から 2024-04-04 19:01:28
0
1
362
SAPUI5 callFunction() が呼び出された後、Errorhandler が呼び出されない SAPUI5のウィザードでIBANを検証しようとしています。これを行うには、V2ODataModel (sap.ui.model.odata.v2.ODataModel) で fu...
から 2024-04-04 18:06:36
0
1
400
Zoom URL をインターセプトするための Cypress テスト 最終的に Zoom リンクにリダイレクトされるテストケースがあります。テストを正しく完了し、ブラウザーのセッションをハングしたり JavaScript の実行を停止したりすることな...
から 2024-04-04 16:16:37
0
1
340
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート