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 相关文章推荐
wordpress之js库集合研究介绍
Aug 17 Javascript
javascript getElementsByName()的用法说明
Jul 31 Javascript
基于jquery的给文章加入关键字链接
Oct 26 Javascript
关于捕获用户何时点击window.onbeforeunload的取消事件
Mar 06 Javascript
chrome浏览器不支持onmouseleave事件的解决技巧
May 31 Javascript
jquery click([data],fn)使用方法实例介绍
Jul 08 Javascript
浅析LigerUi开发中谨慎载入common.css文件
Jul 09 Javascript
window.location.href的用法(动态输出跳转)
Aug 09 Javascript
JavaScript获取元素尺寸和大小操作总结
Feb 27 Javascript
使用node.js中的Buffer类处理二进制数据的方法
Nov 26 Javascript
AngularJS 教程及实例代码
Oct 23 Javascript
vue cli3.0打包上线静态资源找不到路径的解决操作
Aug 03 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 生成文字png图片的代码
2011/04/17 PHP
eAccelerator的安装与使用详解
2013/06/13 PHP
3Z版基于jquery的图片复选框(asp.net+jquery)
2010/04/12 Javascript
Bootstrap Fileinput文件上传组件用法详解
2016/05/10 Javascript
任意Json转成无序列表的方法示例
2016/12/09 Javascript
Angular.js自定义指令学习笔记实例
2017/02/24 Javascript
Javascript中引用类型传递的知识点小结
2017/03/06 Javascript
JS实现移动端实时监听输入框变化的实例代码
2017/04/12 Javascript
在vue.js中抽出公共代码的方法示例
2017/06/08 Javascript
JavaScript实现左侧菜单效果
2017/12/14 Javascript
vue的toast弹窗组件实例详解
2018/05/14 Javascript
微信小程序网络请求封装示例
2018/07/24 Javascript
vue侧边栏动态生成下级菜单的方法
2018/09/07 Javascript
js中怎么判断两个字符串相等的实例
2019/01/17 Javascript
微信小程序整合使用富文本编辑器的方法详解
2019/04/25 Javascript
详解微信小程序支付流程与梳理
2019/07/16 Javascript
如何在 Vue 表单中处理图片
2021/01/26 Vue.js
[01:20]PWL S2开团时刻第三期——团战可以输 蝙蝠必须死
2020/11/26 DOTA
python杀死一个线程的方法
2015/09/06 Python
python Crypto模块的安装与使用方法
2017/12/21 Python
python中单例常用的几种实现方法总结
2018/10/13 Python
python实现统计文本中单词出现的频率详解
2019/05/20 Python
Python virtualenv虚拟环境实现过程解析
2020/04/18 Python
Sunglasses Shop荷兰站:英国最大的太阳镜独立在线零售商和供应商
2017/01/08 全球购物
苹果台湾官网:Apple台湾
2019/01/05 全球购物
Camper鞋西班牙官方网上商店:西班牙马略卡岛的鞋类品牌
2019/03/14 全球购物
SCDKey德国:全球领先的数字游戏市场
2019/04/09 全球购物
Wiggle新西兰:自行车、跑步、游泳
2020/05/06 全球购物
介绍一下SOA和SOA的基本特征
2016/02/24 面试题
成绩单公证书
2014/04/10 职场文书
重阳节演讲稿:尊敬帮助老人 弘扬传统美德
2014/09/25 职场文书
合同权益转让协议书模板
2014/11/18 职场文书
出国签证在职证明范本
2014/11/24 职场文书
西湖英语导游词
2015/02/06 职场文书
2016幼儿园新学期寄语
2015/12/03 职场文书
2016年“12.3”国际残疾人日活动总结
2016/04/01 职场文书