前端表单滑块验证码开发

最新推荐文章于 2024-08-13 10:24:28 发布

Harbor Lau

最新推荐文章于 2024-08-13 10:24:28 发布

阅读量387

点赞数 3

文章标签：前端 java servlet

本文链接：https://blog.csdn.net/weixin_61503139/article/details/138163428

版权

Jsp页面用javascript加滑动验证条_jsp验证码滑动实现-CSDN博客

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>什么是对象以及对象属性</title>
  <script type="text/javascript" charset="utf-8" src="//g.alicdn.com/sd/ncpc/nc.js?t=2015052012"></script>
</head>

<body>
  <div id="your-dom-id" class="nc-container"></div> 
<!--No-Captcha渲染的位置，其中 class 中必须包含 nc-container-->


<script type="text/javascript" >
  var nc_token = ["CF_APP_1", (new Date()).getTime(), Math.random()].join(':');
          var NC_Opt = 
          {
              renderTo: "#your-dom-id",
              appkey: "CF_APP_1",
              scene: "register",
              token: nc_token,
              customWidth: 250,
              trans:{"key1":"code0"},
              elementID: ["usernameID"],
              is_Opt: 0,
              language: "cn",
              isEnabled: true,
              timeout: 3000,
              times:5,
              apimap: {
                  // 'analyze': '//a.com/nocaptcha/analyze.jsonp',
                  // 'get_captcha': '//b.com/get_captcha/ver3',
                  // 'get_captcha': '//pin3.aliyun.com/get_captcha/ver3'
                  // 'get_img': '//c.com/get_img',
                  // 'checkcode': '//d.com/captcha/checkcode.jsonp',
                  // 'umid_Url': '//e.com/security/umscript/3.2.1/um.js',
                  // 'uab_Url': '//aeu.alicdn.com/js/uac/909.js',
                  // 'umid_serUrl': 'https://g.com/service/um.json'
              },   
              callback: function call(data) { 
               
               
                  //在这里写滑动成功以后，可以做的事件，下面是我写的成功之后可以注册的语句，可以改成自己需要的
                 
                  if(1===1){
                    
                      alert("答应我先填完资料ok?1");
                      return true;              
                  } 
                  else{
                      alert("答应我先填完资料ok?");
                      window.location.reload();
                      return false;
                  }
                   }
                  
              };
          var nc = new noCaptcha(NC_Opt);
          nc.upLang('cn', {
              _startTEXT: "请按住滑块，拖动到最右边",
              _yesTEXT: "验证通过",
              _error300: "哎呀，出错了，点击<a href=\"javascript:__nc.reset()\">刷新</a>再来一次",
              _errorNetwork: "网络不给力，请<a href=\"javascript:__nc.reset()\">点击刷新</a>",
          });
  </script> 
  
</body>

</html>