美文网首页
随机生成验证码 兼容ie

随机生成验证码 兼容ie

作者: 念丶凉 | 来源:发表于2019-07-24 11:39 被阅读0次
    //验证码 
    const verifyCode = function (el) {
      var arrayTest = ["m", "n", "v", "x", "z", "a", "b", "c", "d", "e", "f", "g", "h", "j", "k", "l", "q", "w", "r", "t", "y", "u", "i", "i", "o", "p", 1, 2, 3, 4, 5, 6, 7, 8, 9, 0]
    
      function randomColor() {
        var r = parseInt(Math.random() * 256);
        var g = parseInt(Math.random() * 256);
        var b = parseInt(Math.random() * 256);
        var rgb = "rgb(" + r + "," + g + "," + b + ")";
        return rgb;
      }
    
    
      function createSpan(code) {
        let span = document.createElement('span');
        span.style.display = "inline-block"
        span.style.height = "100%"
        span.style.width = "25%"  // 宽度根据验证码个数来定
        span.style.color = randomColor()
        span.innerHTML = code;
        return span
      }
    
      const element = document.getElementById(el);
      element.innerHTML = ''
      let codeArr = []
      // 禁用复制
      element.oncopy = function () {
        return false
      }
      //表示循环几次,循环出多少个数值.
      for (var i = 0; i < 4; i++) {
        var num = parseInt(Math.random() * arrayTest.length);
        var code = arrayTest[num];
        element.style.background = randomColor()
        element.appendChild(createSpan(code))
        codeArr.push(code)
      }
      return codeArr.join('')
    }
    export default verifyCode
    
    

    相关文章

      网友评论

          本文标题:随机生成验证码 兼容ie

          本文链接:https://www.haomeiwen.com/subject/biztrctx.html