JS간단숫자생성기 구현방법(데모소스코드 다운로드 포함)_javascript 기술
- WBOY원래의
- 2016-05-16 15:06:471558검색
이 기사의 예에서는 JS 단순 숫자 생성기의 구현 방법을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 자세한 내용은 다음과 같습니다.
런닝 효과 스크린샷은 다음과 같습니다.
구체적인 코드는 다음과 같습니다.
<!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>
전체 예제 코드를 보려면 여기를 클릭하세요이 사이트에서 다운로드하세요.
더 많은 JavaScript 관련 콘텐츠에 관심이 있는 독자는 이 사이트의 특별 주제를 확인할 수 있습니다: "JavaScript 전환 효과 및 기술 요약", "JavaScript 검색 알고리즘 기술 요약", "JavaScript 애니메이션 특수효과 및 기법 요약", "JavaScript 오류 및 디버깅 기술 요약", "JavaScript 데이터 구조 및 알고리즘 기법 요약", "JavaScript 순회 알고리즘 및 기법 요약" 및 "JavaScript 수학적 연산 사용법 요약"
이 기사가 JavaScript 프로그래밍에 종사하는 모든 사람에게 도움이 되기를 바랍니다.
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.