JavaScript 関数はランダムな色の検証コードをカプセル化します (完全なコード)

JavaScript 関数はランダムな色の検証コードをカプセル化します (完全なコード)

数字、文字、またはランダムな色の数字と文字の混合で構成される n 桁の確認コード。以下に完全なコードを示します。必要な場合はご利用ください。

​
関数 verify(a = 6,b = "num"){
  // 3 つのランダム検証コードを定義します。検証コード ライブラリ var num = "0123456789"
  var str = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNIPQRSTUVWXYZ"
  var ミックスイン = num + str;
  
  //検証コードを格納するための空の文字列を定義します var verify=""
  if(a == 未定義 || b == 未定義){
    // 入力が正当かどうかを確認します。失敗した場合は例外をスローします。throw new Error("Parameter exception");
  }それ以外{
      if(a == "" || b==""){
        //ユーザーが入力していないかどうかを判断します throw new Error("不正なパラメータです。");
      }それ以外{
        //入力タイプを検出して入力するかどうかを決定します var typea = typeof(a);
        var typeb = typeof(b);
        if(typea == "数値" && typeb == "文字列"){
            if(b == "num"){
                  
                //検証コードを受け取るためのループを定義します。純粋なデジタル検証コード for(var i=0;i<a;i++){
                     //色のランダムな値を格納する変数を定義します。var r1 = Math.random()*255;
                     var g1 = Math.random()*255;
                     var b1 = Math.random()*255;
 
                     //ランダムインデックスを決定する var index = Math.floor(Math.random()*(num.length-1))
                     //ランダム検証コードを決定します var char = num[index];
                     //ランダム検証コードに色を追加する verify += `<span style ='color:rgb(${r1},${g1},${b1})'>${char}</span>`
                 }
                 //配列自体に戻る return verify;
            }そうでない場合(b == "str"){
                 (var i=0;i<a;i++){
                   // 純粋な文字の検証コード var r1 = Math.random()*255;
                    var g1 = Math.random()*255;
                    var b1 = Math.random()*255;
 
                    var index = Math.floor(Math.random()*(str.length-1));
                    var char = str[インデックス];
 
                    検証 += `<span style ='color:rgb(${r1},${g1},${b1})'>${char}</span>`
                 }
                 確認を返す。   
            }そうでない場合(b == "ミックスイン"){
                 // 混合検証コード for(var i=0;i<a;i++){
                    var r1 = Math.random()*255;
                    var g1 = Math.random()*255;
                    var b1 = Math.random()*255;
 
                    var index = Math.floor(Math.random()*(mixin.length-1));
                    var char = mixin[インデックス];
 
                    検証 += `<span style ='color:rgb(${r1},${g1},${b1})'>${char}</span>`
                }
                確認を返す。
            }それ以外{
                //検証に失敗した場合は、例外がスローされます。 throw new Error("入力タイプが不正です。")
            }
        
        }それ以外{
            //検証に失敗した場合は、例外がスローされます。 throw new Error("入力タイプが不正です。")
        }
      }
  }
}
 
​

関数を呼び出してみます

  //最初の値はユーザーが入力した長さ、2 番目の値はタイプです。 
 var arr = verify(8,"mixin");
     ドキュメントを書き込みます

上記が結果です!

今後の利便性のためにこれを記録しました。また、大物たちがもっとコミュニケーションを取り、もっとメッセージを残して、私の欠点を指摘してくれることを願っています。

困っている友達はそれを勉強することができます! !

ランダムカラー検証コードのJavaScript関数カプセル化に関するこの記事はこれで終わりです。関連するjs関数カプセル化カラー検証コードの内容については、123WORDPRESS.COMの以前の記事を検索するか、次の関連記事を引き続き参照してください。今後とも123WORDPRESS.COMを応援してください。

以下もご興味があるかもしれません:
  • JSは検証コードのランダム生成を実装します
  • JavaScriptは検証コードと検証のランダム生成を実装します
  • JavaScriptは4桁のランダム検証コードの生成を実装します
  • JavaScriptはボタンをクリックして4桁のランダムな検証コードを生成します

<<:  ダウンロードにおすすめの氷と雪のフォント 33 種類 (個人用および商用)

>>:  検索ナビゲーションバー付きの CSS サンプルコード

推薦する

Vueはスクロールバースタイルを実装します

最初はブラウザのスクロールバーのスタイルを変更して効果を実現したいと思っていましたが、情報を調べてみ...

gbk utf8 GBK と UTF-8 ウェブページエンコーディングを正しく理解して使用する方法

Web ページ エンコーディングは英語では web page encoding と翻訳され、Web ...

jQuery カスタム虫眼鏡効果

この記事の例では、jQueryのカスタム虫眼鏡効果の具体的なコードを参考までに共有しています。具体的...

リンクAの意味論、書き方、ベストプラクティス

リンク A のセマンティクス、ライティング スタイル、およびベスト プラクティス。私は JavaEy...

mysql 5.7.11 winx64 初期パスワード変更

公式サイトからMySQL-5.7.11-winx64の圧縮版をダウンロード。インストール後、パスワー...

CSS3で蓮の花が咲くアニメーション効果を実現

まずは効果を見てみましょう:この効果は非常に華やかに見えますが、原理は複雑ではありません。1 枚の花...

MySQL マルチテーブルクエリの詳細な説明

いつも、気づかないうちに時間というのは驚くほど早く過ぎていきます。小暑が過ぎ、中暑に突入しました。太...

MySQLエラー10061を解決する方法

この記事では、「'localhost' (10061) の MySQL サーバーに接...

パフォーマンス負荷診断にMySQLシステムデータベースを使用する方法

ある達人がかつて、自分の妻のことを知るのと同じくらい、自分が管理するデータベースのことを知るべきだと...

Prometheus を使用して、MySQL の自動増分主キーの残りの使用可能パーセンテージをカウントします。

最近、本番環境のデータベースがログデータを狂ったように書き込み、主キー値のオーバーフローを引き起こし...

Linux ハードウェア構成コマンドの例

ハードウェア ビュー コマンドシステム # uname -a # カーネル/オペレーティング システ...

Linux teeコマンドの使い方の詳しい説明

teeコマンドは主にstandout(標準出力ストリーム、通常はコマンド実行ウィンドウ)に出力し、同...

mysql 10進データ型変換の実装

最近、次のデータ型のデータベースに遭遇しました:decimal(14,4)発生した問題は次のとおりで...

Nginx ロードバランシング クラスタの実装

(1)実験環境youxi1 192.168.5.101 ロードバランサーyouxi2 192.168...

CentOS 7.3 で Nginx 仮想ホストを設定する方法

実験環境最小限にインストールされた CentOS 7.3 仮想マシン基本環境を構成する1. ngin...