
jQuery仿手机微信支付输入密码界面效果,与微信支付密码输入简直一模板一样,浮动弹出数字键盘输入密码完成支付。
js代码
<script type=\"text/javascript\">
$(function(){
//出现浮动层
$(\".ljzf_but\").click(function(){
$(\".ftc_wzsf\").show();
});
//关闭浮动
$(\".close\").click(function(){
$(\".ftc_wzsf\").hide();
$(\".mm_box li\").removeClass(\"mmdd\");
$(\".mm_box li\").attr(\"data\",\"\");
i = 0;
});
//数字显示隐藏
$(\".xiaq_tb\").click(function(){
$(\".numb_box\").slideUp(500);
});
$(\".mm_box\").click(function(){
$(\".numb_box\").slideDown(500);
});
//----
var i = 0;
$(\".nub_ggg li .zf_num\").click(function(){
if(i<6){
$(\".mm_box li\").eq(i).addClass(\"mmdd\");
$(\".mm_box li\").eq(i).attr(\"data\",$(this).text());
i++
if (i==6) {
setTimeout(function(){
var data = \"\";
$(\".mm_box li\").each(function(){
data += $(this).attr(\"data\");
});
alert(\"支付成功\"+data);
},100);
};
}
});
$(\".nub_ggg li .zf_del\").click(function(){
if(i>0){
i--
$(\".mm_box li\").eq(i).removeClass(\"mmdd\");
$(\".mm_box li\").eq(i).attr(\"data\",\"\");
}
});
$(\".nub_ggg li .zf_empty\").click(function(){
$(\".mm_box li\").removeClass(\"mmdd\");
$(\".mm_box li\").attr(\"data\",\"\");
i = 0;
});
});
</script>










暂无评论内容