PC和手机网站滑动拼图验证码效果的源代码，包括弹出Demo、以ajax形式提交二次验证码所需的验证结果值、嵌入式Demo、以表单形式提交二次验证所需的验证结果值，移动终端手动实现弹出Demo

首先，确认前端使用页面，如登陆页面

script src=' http :http://code . jquery.com/jquery-1 . 12 . 3 . min . js '/script script src=' http :http://static . geet.com/static/tools/gt . js '/script 1。登陆页面访问入门类库：如果你的网站使用https，只需要将extreme库引入的地方改为https协议，其他地方不需要改动。例如，用以下代码替换它：

script src=' http :https://code . jquery.com/jquery-1 . 12 . 3 . min . js '/script script src=' http :https://static . geet.com/static/tools/gt . js '/script 2。在初始化前端下面的代码后，

$.ajax({ //获取id、质询、成功(是否启用回切)URL : './web/startcaptchearvlet . PHP？T='(新日期())。getTime()，//添加随机数防止缓存type:' get '，datatype3360' JSON '，Success3360函数(数据){//使用initgetest接口//参数1:配置参数//参数2:回调，回调的第一个参数验证码对象，然后可以用于appendTo initgetest({ gt : data . gt，Challenge:data。Challenge，product:' popup '，//产品形式，包括：浮动、嵌入、弹出。注意offline:仅对PC版本验证码有效！Data.success //表示用户在后台检测极地服务器是否停机，用户在配合SDK }时一般不需要注意，handlerpupp)；} });上面的代码意味着页面加载后，需要在指定的URL地址获取验证码信息。至于上面的网址写的是什么”./web/StartCaptchaServlet。PHP”，我们将在服务器端的代码部署中详细解释这一点。但是需要注意的是，上面的代码中有一个叫做“handlerPopup”的回调函数，这是你需要验证码的真正初始化代码：如下：

//代码详细描述了VAR Handler popup=function(captchobj){//注册提交按钮事件，比如登录按钮$ ('# popup-submit ')。点击(function(){//这里省略了在登录界面获取登录数据的一些步骤。//首先检查验证码VAR Validate=captchaobj.get是否被点击。if(！验证){alert('请先完成验证！');返回；}//提交验证码信息，如登录页面，则需要提交登录信息、用户名和密码等登录数据$。Ajax ({url: './web/verifyloginservlet.php '，type:' post '，//datatype3360' JSON '，Data: {//用户名、密码等其他数据，自己获取，不要演示username : username、password : password、//验证码的数据，这些数据不需要自己获取。//这是二次校验需要的三个值。//当然也可以直接设置验证码进行独立验证。其他信息geet _ challenge : validate . geet _ challenge，geet _ validate 3360 validate . geet _ validate省略。Geetest _ seccode:validate。geetest _ seccode }，//这里是正确返回处理结果的处理函数。//假设返回1、2、3 //当然，返回JSON数据success 3360 function(result){//1表示验证码失败如果(result=' 1') {alert()。);}else if(结果=='2') {alert('错误的用户名或密码！');}else if(结果=='3') {alert('登录成功！');//登录成功，可以在这里做其他处理}else{ alert('登录错误！');} } });});//需要绑定触发验证码的弹出按钮//比如在登录页面上，这个触发按钮就是登录按钮captchobj . bind on(# popup-submit’)；//将验证码添加到id为captcha的元素中//验证码将显示在下面指定的元素中。captchobj . appendo(' # popup-captcha ')；//更多界面参考：http://www.geetest.com/install/sections/idx-client-sdk.html;以上是边肖介绍的PC手机和嵌入式滑动拼图验证码的JS实现。希望对大家有帮助。如果你有任何问题，请给我留言，边肖会及时回复你。非常感谢您对我们网站的支持！