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 相关文章推荐
window.open的页面如何刷新(父页面)上层页面
Dec 28 Javascript
让jQuery Mobile不显示讨厌loading界面的方法
Feb 19 Javascript
jquery淡化版banner异步图片文字效果切换图片特效
Apr 08 Javascript
json的定义、标准格式及json字符串检验
May 11 Javascript
深入理解JavaScript系列(38):设计模式之职责链模式详解
Mar 04 Javascript
javascript实现根据汉字获取简拼
Sep 25 Javascript
微信小程序 122100版本更新问题解决方案
Dec 22 Javascript
详谈JavaScript的闭包及应用
Jan 17 Javascript
原生Javascript插件开发实践
Jan 18 Javascript
ES6中新增的Object.assign()方法详解
Sep 22 Javascript
js简单的分页器插件代码实例
Sep 11 Javascript
原生javascript制作的拼图游戏实现方法详解
Feb 23 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 模拟 asp.net webFrom 按钮提交事件实例
2014/10/13 PHP
PHP+apc+ajax实现的ajax_upload上传进度条代码
2016/01/25 PHP
基于php数组中的索引数组和关联数组详解
2018/03/12 PHP
Span元素的width属性无效果原因及解决方案
2010/01/15 Javascript
jquery 层次选择器siblings与nextAll的区别介绍
2013/08/02 Javascript
使用JS CSS去除IE链接虚线框的三种方法
2013/11/14 Javascript
Jquery 获取对象的几种方式介绍
2014/01/17 Javascript
调用DOM对象的focus使文本框获得焦点
2014/02/19 Javascript
JavaScript队列、优先队列与循环队列
2016/11/14 Javascript
JavaScript 详解预编译原理
2017/01/22 Javascript
vue组件命名和props命名代码详解
2019/09/01 Javascript
VUE DEMO之模拟登录个人中心页面之间数据传值实例
2019/10/31 Javascript
[02:24]DOTA2亚洲邀请赛 NAVI战队出场宣传片
2015/02/07 DOTA
python基础教程之python消息摘要算法使用示例
2014/02/10 Python
用Python中的__slots__缓存资源以节省内存开销的方法
2015/04/02 Python
详解TensorFlow在windows上安装与简单示例
2018/03/05 Python
Python实现的微信好友数据分析功能示例
2018/06/21 Python
Django 404、500页面全局配置知识点详解
2020/03/10 Python
Python通过fnmatch模块实现文件名匹配
2020/09/30 Python
Android本地应用打开方法——通过html5写连接
2016/03/11 HTML / CSS
英国护肤品购物网站:Beauty Expert
2016/08/19 全球购物
捷克汽车配件和工具销售网站:TorriaCars
2018/02/26 全球购物
FC-Moto美国:欧洲最大的摩托车服装和头盔商店之一
2019/08/24 全球购物
会计专业自我鉴定范文
2013/12/29 职场文书
护理人员的自我评价分享
2014/03/15 职场文书
爱护公共设施的标语
2014/06/24 职场文书
小学生教师节演讲稿
2014/09/03 职场文书
个人房屋转让协议书范本
2014/10/26 职场文书
大学生就业推荐表自我评价
2015/03/02 职场文书
食堂卫生管理制度
2015/08/04 职场文书
公司费用报销管理制度
2015/08/04 职场文书
车间安全生产管理制度
2015/08/06 职场文书
体育委员竞选稿
2015/11/21 职场文书
PyTorch 如何自动计算梯度
2021/05/23 Python
mysql脏页是什么
2021/07/26 MySQL
Win11 Build 22000.829更新补丁KB5015882发布(附更新修复内容汇总)
2022/07/15 数码科技