JS实现点击生成UUID的方法完整实例【基于jQuery】


Posted in jQuery onJune 12, 2019

本文实例讲述了JS实现点击生成UUID的方法。分享给大家供大家参考,具体如下:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>3water.com 用JS生成UUID的方法实例</title>
  <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
  <script>
    var id = getUuid();
    $(document).ready(function() {
      $("p").click(function() {
        alert(id);
      });
    });
    function getUuid() {
      var len = 32;//32长度
      var radix = 16;//16进制
      var chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split('');
      var uuid = [], i;
      radix = radix || chars.length;
      if(len) {
        for(i = 0; i < len; i++)uuid[i] = chars[0 | Math.random() * radix];
      } else {
        var r;
        uuid[8] = uuid[13] = uuid[18] = uuid[23] = '-';
        uuid[14] = '4';
        for(i = 0; i < 36; i++) {
          if(!uuid[i]) {
            r = 0 | Math.random() * 16;
            uuid[i] = chars[(i == 19) ? (r & 0x3) | 0x8 : r];
          }
        }
      }
      return uuid.join('');
    }
  </script>
</head>
<body>
<p>点我,生成UUID。</p>
</body>
</html>

运行结果:

JS实现点击生成UUID的方法完整实例【基于jQuery】

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

jQuery 相关文章推荐
jQuery ajax请求struts action实现异步刷新
Apr 19 jQuery
使用jQuery ajaxupload插件实现无刷新上传文件
Apr 23 jQuery
jQuery 实现图片的依次加载图片功能
Jul 06 jQuery
jQuery.Ajax()的data参数类型详解
Jul 23 jQuery
jquery对table做排序操作的实例演示
Aug 10 jQuery
jQuery EasyUI结合zTree树形结构制作web页面
Sep 01 jQuery
jquery之基本选择器practice(实例讲解)
Sep 30 jQuery
关于jQuery里prev()的简单操作代码
Oct 27 jQuery
jQuery 导航自动跟随滚动的实现代码
May 30 jQuery
jquery.pager.js实现分页效果
Jul 29 jQuery
jQuery实现input[type=file]多图预览上传删除等功能
Aug 02 jQuery
jQuery实现简易聊天框
Feb 08 jQuery
jquery操作checkbox的常用方法总结【附测试源码下载】
Jun 10 #jQuery
基于jquery实现的tab选项卡功能示例【附源码下载】
Jun 10 #jQuery
基于Bootstrap和JQuery实现动态打开和关闭tab页的实例代码
Jun 10 #jQuery
jQuery+ajax实现批量删除功能完整示例
Jun 06 #jQuery
jquery+ajax实现上传图片并显示上传进度功能【附php后台接收】
Jun 06 #jQuery
jQuery操作cookie的示例代码
Jun 05 #jQuery
jquery UI实现autocomplete在获取焦点时得到显示列表功能示例
Jun 04 #jQuery
You might like
在PHP中使用反射技术的架构插件使用说明
2010/05/18 PHP
XAMPP安装与使用方法详细解析
2013/11/27 PHP
PHP中exec与system用法区别分析
2014/09/22 PHP
PHP控制前台弹出对话框的实现方法
2016/08/21 PHP
PHP实现广度优先搜索算法(BFS,Broad First Search)详解
2017/09/16 PHP
初学Javascript的一些总结
2008/11/03 Javascript
JS完整获取IE浏览器信息包括类型、版本、语言等等
2014/05/22 Javascript
JavaScript实现多个重叠层点击切换效果的方法
2015/04/24 Javascript
KnockoutJS 3.X API 第四章之事件event绑定
2016/10/10 Javascript
微信公众平台开发教程(四) 实例入门:机器人回复(附源码)
2016/12/02 Javascript
JS中检测数据类型的几种方式及优缺点小结
2016/12/12 Javascript
微信小程序 action-sheet 反馈上拉菜单简单实例
2017/05/11 Javascript
Angular实现响应式表单
2017/08/04 Javascript
vue实现的封装全局filter并统一管理操作示例
2020/02/02 Javascript
[02:13] 完美世界DOTA2联赛PWL DAY5集锦
2020/11/03 DOTA
Python脚本暴力破解栅栏密码
2015/10/19 Python
Python压缩解压缩zip文件及破解zip文件密码的方法
2015/11/04 Python
利用python模拟实现POST请求提交图片的方法
2017/07/25 Python
浅谈Python实现贪心算法与活动安排问题
2017/12/19 Python
python脚本监控Tomcat服务器的方法
2018/07/06 Python
Python 删除整个文本中的空格,并实现按行显示
2018/07/24 Python
在python中pandas的series合并方法
2018/11/12 Python
安装完Python包然后找不到模块的解决步骤
2020/02/13 Python
python框架Django实战商城项目之工程搭建过程图文详解
2020/03/09 Python
css3 边框、背景、文本效果的实现代码
2018/03/21 HTML / CSS
美国最大的袜子制造商和零售商:Renfro Socks
2017/09/03 全球购物
会计系个人求职信范文分享
2013/12/20 职场文书
《燕子》教学反思
2014/02/18 职场文书
大学生就业求职信
2014/06/12 职场文书
房地产端午节活动方案
2014/08/24 职场文书
2014年教师节红领巾广播稿
2014/09/10 职场文书
部队2014年终工作总结
2014/11/27 职场文书
2014年个人总结范文
2015/03/09 职场文书
班主任培训研修日志
2015/11/13 职场文书
2016年离婚协议书范文
2016/03/18 职场文书
Golang解析JSON对象
2022/04/30 Golang