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 相关文章推荐
ExtJS PropertyGrid中使用Combobox选择值问题
Jun 13 Javascript
CSS3 3D 技术手把手教你玩转
Sep 02 Javascript
jQuery实现checkbox列表的全选、反选功能
Nov 24 Javascript
微信小程序侧边栏滑动特效(左右滑动)
Jan 23 Javascript
Django与Vue语法的冲突问题完美解决方法
Dec 14 Javascript
微信小程序简单的canvas裁剪图片功能详解
Jul 12 Javascript
Vue项目中使用better-scroll实现菜单映射功能方法
Sep 11 Javascript
Vue实现数据请求拦截
Oct 23 Javascript
Vue项目vscode 安装eslint插件的方法(代码自动修复)
Apr 15 Javascript
Vue优化:常见会导致内存泄漏问题及优化详解
Aug 04 Javascript
基于vue实现简易打地鼠游戏
Aug 21 Javascript
Vue2.0搭建脚手架
Mar 13 Vue.js
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 foreach 参数强制类型转换的问题
2010/12/10 PHP
让php处理图片变得简单 基于gb库的图片处理类附实例代码下载
2011/05/17 PHP
PHP+ajaxfileupload+jcrop插件完美实现头像上传剪裁
2014/06/09 PHP
php不使用copy()函数复制文件的方法
2015/03/13 PHP
PHP中类的自动加载的方法
2017/03/17 PHP
TNC vs BOOM BO3 第二场2.13
2021/03/10 DOTA
一个js拖拽的效果类和dom-drag.js浅析
2010/07/17 Javascript
yepnope.js 异步加载资源文件
2011/09/08 Javascript
jQuery 数据缓存模块进化史详细介绍
2012/11/19 Javascript
JS解析json数据并将json字符串转化为数组的实现方法
2012/12/25 Javascript
给超链接添加特效鼠标移动展示提示信息且随鼠标移动
2013/10/17 Javascript
浏览器兼容console对象的简要解决方案分享
2013/10/24 Javascript
JavaScript前端图片加载管理器imagepool使用详解
2014/12/29 Javascript
HTML5实现留言和回复页面样式
2015/07/22 Javascript
javascript实现动态导入js与css等静态资源文件的方法
2015/07/25 Javascript
微信小程序实现流程进度的图样式功能
2018/01/16 Javascript
微信小程序实现传递多个参数与事件处理
2019/08/12 Javascript
[42:04]DOTA2上海特级锦标赛主赛事日 - 2 胜者组第一轮#3Secret VS OG第一局
2016/03/03 DOTA
Python matplotlib画图实例之绘制拥有彩条的图表
2017/12/28 Python
python把ipynb文件转换成pdf文件过程详解
2019/07/09 Python
PyQt5+Caffe+Opencv搭建人脸识别登录界面
2019/08/28 Python
Ellos丹麦:时尚和服装在线
2016/09/19 全球购物
马来西亚和新加坡巴士票在线预订:CatchThatBus
2018/11/17 全球购物
综合测评自我鉴定
2013/10/08 职场文书
急诊科护士自我鉴定
2013/10/14 职场文书
父亲八十大寿答谢词
2014/01/23 职场文书
搞笑爱情保证书
2014/04/29 职场文书
基层党员公开承诺书
2014/05/29 职场文书
公司经理任命书
2014/06/05 职场文书
餐厅周年庆活动方案
2014/08/25 职场文书
食品质检员岗位职责
2015/04/08 职场文书
幼儿园六一主持词开场白
2015/05/28 职场文书
2019职场单身人才调研报告:互联网行业单身比例最高
2019/08/07 职场文书
使用golang编写一个并发工作队列
2021/05/08 Golang
利用JuiceFS使MySQL 备份验证性能提升 10 倍
2022/03/17 MySQL
python神经网络 tf.name_scope 和 tf.variable_scope 的区别
2022/05/04 Python