Heim > Artikel > Web-Frontend > Implementierungsmethode für den einfachen JS-Zahlengenerator (mit Download des Demo-Quellcodes)_Javascript-Kenntnisse

Implementierungsmethode für den einfachen JS-Zahlengenerator (mit Download des Demo-Quellcodes)_Javascript-Kenntnisse

WBOYOriginal: 2016-05-16 15:06:471559Durchsuche

Das Beispiel in diesem Artikel beschreibt die Implementierungsmethode des einfachen JS-Zahlengenerators. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

Der Screenshot des Laufeffekts sieht wie folgt aus:

Der spezifische Code lautet wie folgt:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>编号生成器</title>
</head>
<body>
<h1>编号生成器</h1>
<div>
前缀：<input id="txtBegin" type="text" value="" /> 后缀：<input id="txtEnd" type="text" value="" />
<br />
位数：<input id="numCount" type="number" value="5" />
</div>
<div style="margin:10px 0;">
<label><input type="radio" name="a1" onclick="fnNum();" checked /> 连续数字</label>
<label><input type="radio" name="a1" onclick="fnPwd();" /> 随机字符</label>
</div>
<div id="divNum">
范围：<input id="numBegin" type="number" value="0" /> ~ <input id="numEnd" type="number" value="100" />
<br />
过滤字符：<input id="txtLimit" type="text" value="" /> 多个使用,号分割
</div>
<div id="divPwd" style="display:none;">
<h3>0123456789 abcdefghijklmnopqrstuvwxyz ABCDEFGHIJKLMNOPQRSTUVWXYZ</h3>
包含字符：<input id="txtChar" type="text" value="ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789" style="width:600px;" />
<br />
随机生成个数：<input id="txtCount" type="number" value="100" />
</div>
<input type="button" value="生成号码" onclick="run();" /> <span id="spanResult"></span>
<hr />
<textarea id="txtContent" style="width:600px; height:500px;">
</textarea>
<script>
var boNum = true;
function fnNum()
{
  document.getElementById('divNum').style.display = 'block';
  document.getElementById('divPwd').style.display = 'none';
  boNum = true;
}
function fnPwd()
{
  document.getElementById('divNum').style.display = 'none';
  document.getElementById('divPwd').style.display = 'block';
  boNum = false;
}
function run()
{
  var str = '';
  var txtCount = parseInt(document.getElementById('txtCount').value);
  var txtBegin = document.getElementById('txtBegin').value;
  var txtEnd = document.getElementById('txtEnd').value;
  var txtChar = document.getElementById('txtChar').value;
  var numCount = parseInt(document.getElementById('numCount').value);
  var numBegin = parseInt(document.getElementById('numBegin').value);
  var numEnd = parseInt(document.getElementById('numEnd').value);
  var txtLimit = document.getElementById('txtLimit').value;
  var limit = txtLimit.split(',');
  if (txtLimit == '')
  {
    limit = [];
  }
  var count = 0;
  if (!boNum)
  {
    var list = [];
    for (var i=0; i<txtCount; i++)
    {
      var s = '';
      for (var j=0; j<numCount; j++)
      {
        s += txtChar.charAt(Math.floor(Math.random() * txtChar.length));
      }
      var bo = false;
      for (var ii=0; ii<list.length; ii++)
      {
        if (list[ii] == s)
        {
          bo = true;
          alert(s);
          break;
        }
      }
      if (bo) continue;
      str += txtBegin + s + txtEnd + '\r\n';
      list.push(s);
      count++;
    }
  }
  else
  {
    for (var i=numBegin; i<numEnd+1; i++)
    {
      var s = '' + i;
      s = (new Array( numCount - s.length + 1 ).join('0')) + s;
      var bo = false;
      for (var k=0; k<limit.length; k++)
      {
        if (s.indexOf(limit[k]) != -1)
        {
          bo = true;
          break;
        }
      }
      if (bo) continue;
      str += txtBegin + s + txtEnd + '\r\n';
      count++;
    }
  }
  document.getElementById('txtContent').value = str;
  document.getElementById('spanResult').innerHTML = '生成了 ' + count + ' 个';
}
</script>
</body>
</html>

Klicken Sie hier für den vollständigen BeispielcodeDownload von dieser Website.

Leser, die an mehr JavaScript-bezogenen Inhalten interessiert sind, können sich die Spezialthemen auf dieser Website ansehen: „Zusammenfassung der JavaScript-Umschalteffekte und -Techniken“, „Zusammenfassung der JavaScript-Suchalgorithmustechniken", "Zusammenfassung der Spezialeffekte und Techniken der JavaScript-Animation", "Zusammenfassung der JavaScript-Fehler und Debugging-Fähigkeiten", "Zusammenfassung der JavaScript-Datenstrukturen und Algorithmustechniken“, „JavaScript-Traversal-Zusammenfassung von Algorithmen und Techniken“ und „Zusammenfassung der Verwendung mathematischer JavaScript-Operationen“

Ich hoffe, dass dieser Artikel für alle hilfreich ist, die sich mit der JavaScript-Programmierung befassen.

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：Eine kurze Analyse der Verwendung und Vorteile von Javascript-Ereignisdelegation_Javascript-FähigkeitenNächster Artikel：Eine kurze Analyse der Verwendung und Vorteile von Javascript-Ereignisdelegation_Javascript-Fähigkeiten

In Verbindung stehende Artikel

Mehr sehen