先上個效果圖
1.
在head之間加入
<head>
<script type="text/javascript" charset="utf-8" src="//g.alicdn.com/sd/ncpc/nc.js?t=2015052012"></script>
</head>
2.
在jsp頁面想要顯示滑動條處加入
<div id="your-dom-id" class="nc-container"></div>
<!--No-Captcha渲染的位置，其中 class 中必須包含 nc-container-->
3.
在body下加入javascript。
注意！！！！一定要在body下方加，否則滑動條很可能顯示不出來。
<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) {
window.console && console.log(nc_token);
window.console && console.log(data.csessionid);
window.console && console.log(data.sig);
//在這裏寫滑動成功以後，可以做的事件，下面是我寫的成功之後可以註冊的語句，可以改成自己需要的
/* var uname=checkName();
var pwd=checkpwd();
var apwd=checkapwd();
if(uname&&pwd&&apwd){
document.getElementById("regist").disabled="";
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>
完事！
