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 相关文章推荐
Javascript中的常见排序算法
Mar 27 Javascript
javascript中节点的最近的相关节点访问方法
Mar 20 Javascript
JavaScript地图拖动功能SpryMap的简单实现
Jul 17 Javascript
jQuery实现默认是闭合的FAQ展开效果菜单
Sep 14 Javascript
由简入繁实现Jquery树状结构的方法(推荐)
Jun 10 Javascript
easyui-edatagrid.js实现回车键结束编辑功能的实例
Apr 12 Javascript
JavaScript代码判断输入的字符串是否含有特殊字符和表情代码实例
Aug 17 Javascript
详解webpack的配置文件entry与output
Aug 21 Javascript
node.js博客项目开发手记
Mar 16 Javascript
Angular5给组件本身的标签添加样式class的方法
Apr 07 Javascript
基于jQuery.i18n实现web前端的国际化
May 04 jQuery
vue中利用simplemde实现markdown编辑器(增加图片上传功能)
Apr 29 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
PHP IDE PHPStorm配置支持友好Laravel代码提示方法
2015/05/12 PHP
刷新PHP缓冲区为你的站点加速
2015/10/10 PHP
PHP给文字内容中的关键字进行套红处理
2016/04/12 PHP
php实现有序数组打印或排序的方法【附Python、C及Go语言实现代码】
2016/11/10 PHP
一些不错的js函数ajax
2008/08/20 Javascript
文字垂直滚动之javascript代码
2015/07/29 Javascript
jQuery仿淘宝网产品品牌隐藏与显示效果
2015/09/01 Javascript
js实现仿MSN带关闭功能的右下角弹窗代码
2015/09/04 Javascript
JS+CSS实现简单的二级下拉导航菜单效果
2015/09/21 Javascript
JS实现支持Ajax验证的表单插件
2016/03/24 Javascript
使用纯JS代码判断字符串中有多少汉字的实现方法(超简单实用)
2016/11/12 Javascript
Vue.js实现一个SPA登录页面的过程【推荐】
2017/04/29 Javascript
electron demo项目npm install安装失败的解决方法
2018/02/06 Javascript
在vue中实现点击选择框阻止弹出层消失的方法
2018/09/15 Javascript
Vue axios全局拦截 get请求、post请求、配置请求的实例代码
2018/11/28 Javascript
vue使用swiper.js重叠轮播组建样式
2019/11/14 Javascript
JavaScript交换两个变量方法实例
2019/11/25 Javascript
python单链表实现代码实例
2013/11/21 Python
Python多线程实例教程
2014/09/06 Python
python3 flask实现文件上传功能
2020/03/20 Python
django中ORM模型常用的字段的使用方法
2019/03/05 Python
TensorFlow车牌识别完整版代码(含车牌数据集)
2019/08/05 Python
PyTorch笔记之scatter()函数的使用
2020/02/12 Python
Python多线程的退出控制实现
2020/08/10 Python
利用纯CSS3实现文字向右循环闪过效果实例(可用于移动端)
2017/06/15 HTML / CSS
css3 transform属性详解
2014/09/30 HTML / CSS
英国骑行、跑步、游泳、铁人三项运动装备专卖店:Wiggle
2016/08/23 全球购物
英国男士时尚网站:Dandy Fellow
2018/02/09 全球购物
视光学专业自荐信
2014/06/24 职场文书
中职毕业生自我鉴定
2014/09/13 职场文书
办理护照工作证明
2014/10/10 职场文书
离婚协议书应该怎么写
2014/10/12 职场文书
拖欠货款起诉状
2015/05/20 职场文书
期中考试后的感想
2015/08/07 职场文书
党风廉洁教育心得体会
2016/01/20 职场文书
python中Matplotlib绘制直线的实例代码
2021/07/04 Python