jquery表單如何獲取短信驗證碼代碼?

2017-03-13 1968 9 編輯:深圳網站建設 來源:互聯網

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>jquery表單獲取短信驗證碼代碼</title>

<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>

<script type="text/javascript">

$(function  () {

        //獲取短信驗證碼

        var validCode=true;

        $(".msgs").click (function  () {

                var time=30;

                var code=$(this);

                if (validCode) {

                        validCode=false;

                        code.addClass("msgs1");

                var t=setInterval(function  () {

                        time--;

                        code.html(time+"秒");

                        if (time==0) {

                                clearInterval(t);

                        code.html("重新獲取");

                                validCode=true;

                        code.removeClass("msgs1");

                        }

                },1000)

                }

        })

})

</script>

<style type="text/css">

form{margin:200px auto;width:500px;}

label{font-size:14px;color:#555;line-height:40px;margin-right:10px;}

input{width:212px;height:38px;border-style:none;padding:0 4px;border:1px solid #C8C8C8;margin-right:10px;outline:none;}

.msgs{display:inline-block;width:104px;color:#fff;font-size:12px;border:1px solid #0697DA;text-align:center;height:30px;line-height:30px;background:#0697DA;cursor:pointer;}

form .msgs1{background:#E6E6E6;color:#818080;border:1px solid #CCCCCC;}

</style>

</head>

<body>

<form>

        <label style="float:left;">驗&nbsp;&nbsp;證&nbsp;碼</label>

        <input type="text" class="c_code_msg" style="margin-right: 10px;">

        <span class="msgs">獲取短信驗證碼</span>

</form>

</body>

</html>

jquery表單獲取短信驗證碼代.jpg

專業的網站建設公司,深正互聯,如您有網站營銷需求,請您關注我們,或者致電13828884598


本站文章均為深正網站建設摘自權威資料,書籍,或網絡原創文章,如有版權糾紛或者違規問題,請即刻聯系我們刪除,我們歡迎您分享,引用和轉載,但謝絕直接搬磚和抄襲!感謝...
關注深正互聯
七星彩头尾 大话西游2经典版赚钱6 英雄联盟铺助怎么赚钱 捕鱼达人游戏机 全民内蒙古麻将打大a 手游捕鱼来了怎么赚钱 大理拍照赚钱 微商零元投资在家手工赚钱 网络捕鱼99炮游戏下载 山东麻将怎么和牌 高频彩稳定赚钱 盛世皇朝游戏 淘宝浏览单能赚钱吗 外盘代理赚钱吗 万达彩票首页 王国新大陆赚钱 美女捕鱼游戏