返回顶部
首页 > 资讯 > 前端开发 > VUE >js如何随机生成一个验证码
  • 845
分享到

js如何随机生成一个验证码

2024-04-02 19:04:59 845人浏览 安东尼
摘要

这篇文章给大家分享的是有关js如何随机生成一个验证码的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。效果:html代码:<p>验证码:</p>  

这篇文章给大家分享的是有关js如何随机生成一个验证码的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。

效果:

js如何随机生成一个验证码

html代码:

<p>验证码:</p>
 <div id="login" onclick="change()">
  <a href="#" rel="external nofollow" ></a>
 </div>

给div设置了一个click点击事件,js代码如下:

 function getCode(n) {
  var all = "azxcvbnmsdfghjklqwertyuiopZXCVBNMASDFGHJKLQWERTYUIOP0123456789";
  var b = "";
  for (var i = 0; i < n; i++) {
   var index = Math.floor(Math.random() * 62);
   b += all.charAt(index);

  }
  return b;
 };

 function change() {
  document.getElementById("login").innerHTML = getCode(4);

 }
 window.onload = change;

定义一个变量,令它的值为26个字母和0-9十个数字。

Math.random()是令系统随机选取大于等于 0.0 且小于 1.0 的伪随机double 值。
例如:Math.random()*62 得到的值:

js如何随机生成一个验证码

Math.floor 是对一个数字向下取整,之前在博客里面有提到过。

charAt方法可返回指定位置的字符,之前在博客里面也有提到过。

这些都已经很熟悉了,就当作是复习一遍吧。

拿到随机的四个数字,拼接到div标签里。就得到了想要的效果。

感谢各位的阅读!关于“js如何随机生成一个验证码”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!

--结束END--

本文标题: js如何随机生成一个验证码

本文链接: https://lsjlt.com/news/67452.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • js如何随机生成一个验证码
    这篇文章给大家分享的是有关js如何随机生成一个验证码的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。效果:html代码:<p>验证码:</p>  ...
    99+
    2024-04-02
  • Python3 生成一个随机验证码
    '''设计一个八位随机验证码,验证码是由大写字母,小写字母和数字三种字符组成。定义一个范围只有1,2,3的随机数,如果这个随机数是1,则八位验证码的当前位置用大写字母;                            如果这个随机数是...
    99+
    2023-01-31
    验证码
  • JS实现随机生成验证码
    本文实例为大家分享了JS实现随机生成验证码的具体代码,供大家参考,具体内容如下 <!DOCTYPE html> <html> <head>...
    99+
    2024-04-02
  • QT如何生成随机验证码
    这篇“QT如何生成随机验证码”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“QT如何生成随机验证码”文章吧。一、先创建一个QT...
    99+
    2023-07-02
  • React tsx如何生成随机验证码
    这篇文章主要介绍React tsx如何生成随机验证码,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!React tsx 生成随机验证码,具体内容如下最近开发React 使用tsx编写,没有找到什么好的随机生成验证码的插...
    99+
    2023-06-14
  • Android随机生成验证码
    Android随机生成验证码,Android利用随机数绘制不规则的验证码,加强用户登录或者注册的安全性。 具体思路如下: 在一块固定宽高的画布上,画上固定个数的随机数字和字母,...
    99+
    2022-06-06
    验证码 Android
  • python生成随机验证码
    一、生成随机验证码(纯数字及字母加数字): import random import string checkcod='' for i in range(5): #5位验证码 ''' #纯数字验证码 #随机值1-...
    99+
    2023-01-31
    验证码 python
  • 使用Java怎么生成一个随机验证码
    这篇文章将为大家详细讲解有关使用Java怎么生成一个随机验证码,文章内容质量较高,因此小编分享给大家做个参考,希望大家阅读完这篇文章后对相关知识有一定的了解。源代码:RandomGen.java(实现产生验证码功能的类)package ve...
    99+
    2023-05-31
    java ava
  • React tsx生成随机验证码
    React tsx 生成随机验证码,供大家参考,具体内容如下 最近开发React 使用tsx编写,没有找到什么好的随机生成验证码的插件,自己就手撸了一个,废话不多话,直接上代码。 t...
    99+
    2024-04-02
  • 利用Java 编写一个随机生成验证码功能
    这篇文章给大家介绍利用Java 编写一个随机生成验证码功能,内容非常详细,感兴趣的小伙伴们可以参考借鉴,希望对大家能有所帮助。Java 实现随机验证码功能简单实例现在许多系统的注册、登录或者发布信息模块都添加的随机码功能,就是为了避免自动注...
    99+
    2023-05-31
    java ava 验证码
  • Android实现随机生成验证码
    本文实例为大家分享了Android验证码的随机生成代码,供大家参考,具体内容如下 Code.java package com.example.myapp; import and...
    99+
    2024-04-02
  • 利用Java如何实现一个随机生成动态验证码功能
    利用Java如何实现一个随机生成动态验证码功能?针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。前言相对来说呢,jpg格式的相对来说容易破解一点,当然也取决于你的干扰元素,元素...
    99+
    2023-05-31
    java 动态 验证码
  • JavaScript中怎么生成随机验证码
    这篇文章将为大家详细讲解有关JavaScript中怎么生成随机验证码,文章内容质量较高,因此小编分享给大家做个参考,希望大家阅读完这篇文章后对相关知识有一定的了解。利用canvas制作一个随机验证码:  1...
    99+
    2024-04-02
  • QT生成随机验证码的方法
    本文实例为大家分享了QT生成随机验证码的具体代码,供大家参考,具体内容如下 一、先创建一个QT应用程序,在ui中添加一个QFrame控件,后期将这个控件提升为下面自己实现验证码的类就...
    99+
    2024-04-02
  • php怎么能随机生成验证码
    这篇文章给大家分享的是有关php怎么能随机生成验证码的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。代码如下:<phpclass functions{    ...
    99+
    2023-06-15
  • JavaScript实现随机生成验证码及校验
    本文实例为大家分享了JavaScript实现随机生成验证码及校验的具体代码,供大家参考,具体内容如下 输入验证码(区分大小写)点击确认,进行校验。出错就弹框提示 点击 看不清 重新随...
    99+
    2024-04-02
  • python生成随机图形验证码详解
    使用python生成随机图片验证码,需要使用pillow模块 1.安装pillow模块 pip install pillow 2.pillow模块的基本使用 1.创建图片 from PIL imp...
    99+
    2022-06-04
    验证码 详解 图形
  • 利用Python生成随机4位验证码
    """            作者:白            时间:2018年1月8日            功能: 生成随机4位验证码(必须由两个2字母和2个数字组成) """ import  random def main():   ...
    99+
    2023-01-31
    验证码 Python
  • java实现随机验证码图片生成
    本文实例为大家分享了java生成随机验证码图片的具体代码,供大家参考,具体内容如下 1.controller @GetMapping(value = "/getRan...
    99+
    2024-04-02
  • 利用Python生成随机验证码详解
    目录1.先搞环境2.开始码代码3. 加干扰4. 加入更多的干扰5. 验证码 + 随机字符6. 验证码保存本地(选)最近感觉被大数据定义成机器人了,随便看个网页都跳验证码。 怎么用p...
    99+
    2024-04-02
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作