缘由
一个页面需要两个验证码，使用同一个验证码调用两次会导致有前一个失效。那么我们需要创建不同的两个验证码，分别做验证。
截图展示
具体实现
- 同时引入多个KgCaptcha的js。
- 引入多个JS时，请定义 plural 参数；通过该参数区分定义对象名，如plural=1，则对象名为kg1，以此类推。
<scriptsrc="captcha.js?appid=XXX&plural=1"id="KgCaptcha1"></script><scriptsrc="captcha.js?appid=XXX&plural=2"id="KgCaptcha2"></script>
- 初始化验证码
<scripttype="text/javascript">// 第一个验证码kg1.captcha({ // 绑定元素，验证框显示区域bind: "#captchaBox1", // 验证成功事务处理success: function(e) { console.log(e); }, // 验证失败事务处理failure: function(e) { console.log(e); }, // 点击刷新按钮时触发refresh: function(e) { console.log(e); } }); // 第二个验证码kg2.captcha({ // 绑定元素，验证框显示区域bind: "#captchaBox2", // 验证成功事务处理success: function(e) { console.log(e); }, // 验证失败事务处理failure: function(e) { console.log(e); }, // 点击刷新按钮时触发refresh: function(e) { console.log(e); } }); </script>
- 创建验证框显示区域
<!-- 第一个验证码 --><divid="captchaBox1"></div><!-- 第二个验证码 --><divid="captchaBox2"></div>
总结
SDK开源地址：https://github.com/KgCaptcha，顺便做了一个演示：https://www.kgcaptcha.com/demo/
