JS简单编号生成器实现方法(附demo源码下载)


Posted in Javascript onApril 05, 2016

本文实例讲述了JS简单编号生成器实现方法。分享给大家供大家参考,具体如下:

运行效果截图如下:

JS简单编号生成器实现方法(附demo源码下载)

具体代码如下:

<!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 相关文章推荐
Jquery中getJSON在asp.net中的使用说明
Mar 10 Javascript
JQuery 自定义CircleAnimation,Animate方法学习笔记
Jul 10 Javascript
javascript不可用的问题探究
Oct 01 Javascript
js判断浏览器类型为ie6时不执行
Jun 15 Javascript
JavaScript中的null和undefined区别介绍
Jan 01 Javascript
jQuery和AngularJS的区别浅析
Jan 29 Javascript
原生JS实现九宫格抽奖效果
Apr 01 Javascript
Vue组件选项props实例详解
Aug 18 Javascript
微信小程序报错:this.setData is not a function的解决办法
Sep 27 Javascript
微信小程序中使用ECharts 异步加载数据实现图表功能
Jul 13 Javascript
JavaScript中Array方法你该知道的正确打开方法
Sep 11 Javascript
在vue中使用image-webpack-loader实例
Nov 12 Javascript
JS基于ocanvas插件实现的简单画板效果代码(附demo源码下载)
Apr 05 #Javascript
JavaScript图像延迟加载库Echo.js
Apr 05 #Javascript
超漂亮的Bootstrap 富文本编辑器summernote
Apr 05 #Javascript
jQuery技巧之让任何组件都支持类似DOM的事件管理
Apr 05 #Javascript
JS+CSS实现闪烁字体效果代码
Apr 05 #Javascript
js拖拽的原型声明和用法总结
Apr 04 #Javascript
javascript如何实现360度全景照片问题汇总
Apr 04 #Javascript
You might like
Zend的Registry机制的使用说明
2013/05/02 PHP
PHP产生不重复随机数的5个方法总结
2014/11/12 PHP
PHP 返回13位时间戳的实现代码
2016/05/13 PHP
PHP中rename()函数的妙用讲解
2019/02/28 PHP
PHP7使用ODBC连接SQL Server2008 R2数据库示例【基于thinkPHP5.1框架】
2019/05/06 PHP
ext监听事件方法[初级篇]
2008/04/27 Javascript
通过js为元素添加多项样式,浏览器全兼容写法
2014/08/30 Javascript
JavaScript中document对象使用详解
2015/01/06 Javascript
jquery解析XML及获取XML节点名称的实现代码
2016/05/18 Javascript
简单实现js间歇或无缝滚动效果
2016/06/29 Javascript
Bootstrap基本组件学习笔记之缩略图(13)
2016/12/08 Javascript
最好用的Bootstrap fileinput.js文件上传组件
2016/12/12 Javascript
jquery easyui dataGrid动态改变排序字段名的方法
2017/03/02 Javascript
nodejs读写json文件的简单方法(必看)
2017/03/09 NodeJs
前端框架学习总结之Angular、React与Vue的比较详解
2017/03/14 Javascript
jstree单选功能的实现方法
2017/06/07 Javascript
nuxt框架中路由鉴权之Koa和Session的用法
2018/05/09 Javascript
JavaScript数组及常见操作方法小结
2019/11/13 Javascript
JS变量提升及函数提升实例解析
2020/09/03 Javascript
vue实现表格合并功能
2020/12/01 Vue.js
vue+echarts实现中国地图流动效果(步骤详解)
2021/01/27 Vue.js
浅谈Django学习migrate和makemigrations的差别
2018/01/18 Python
python 定义给定初值或长度的list方法
2018/06/23 Python
python的继承知识点总结
2018/12/10 Python
Numpy(Pandas)删除全为零的列的方法
2020/09/11 Python
如何基于Python实现word文档重新排版
2020/09/29 Python
使用python-cv2实现Harr+Adaboost人脸识别的示例
2020/10/27 Python
Python3 用什么IDE开发工具比较好
2020/11/28 Python
岗位职责的构建方法
2014/02/01 职场文书
《童趣》教学反思
2014/02/19 职场文书
入党积极分子批评与自我批评思想汇报
2014/09/14 职场文书
初二英语教学反思
2016/02/15 职场文书
导游词之五台山
2019/10/11 职场文书
在前女友婚礼上,用Python破解了现场的WIFI还把名称改成了
2021/05/28 Python
python批量创建变量并赋值操作
2021/06/03 Python
PHP中国际化的字符串排序和比较对象详解
2021/08/23 PHP