jquery实现简单的验证码倒计时的效果

HTML：

<div class="container">
　　<form>
　　　　<div class="form-group">
　　　　　　<label for="phone" class="control-label">手机号</label>
　　　　　　<div class="col-sm-11">
　　　　　　　　<input type="text" class="form-control" id="phone">

　　　　　　　　<input type="button" class="btn btn-primary" value="发送验证码" />
　　　　　　</div>
　　　　<div>
　　</form>
</div>

jq代码：

<script type="text/javascript">
　　$(function() {
　　　　var code = true; //表示验证码已经发送
　　　　$('.btn').click(function() {
　　　　　　var $val = $('#phone').val(); //
　　　　　　var reg = /^1\d{10}$/; //电话号码验证规则
　　　　　　var that = $(this);
　　　　　　if($val.length == 0 || !reg.test($val)) { //如果电话号码为空或者电话号码输入不正确
　　　　　　　　swal("", "手机号不能为空！", "error"); //提示信息
　　　　　　　　return false;
　　　　　　}
　　　　　　if(reg.test($val)) { //如果电话号码输入正确，则验证码发送成功，倒计时开始
　　　　　　　　var timer = 60;
　　　　　　　　if(code) {
　　　　　　　　swal("", "验证码发送成功！", "success");
　　　　　　　　code = false;//表示当验证码发送完成后，发送按钮不可点击
　　　　　　　　var n = setInterval(function() {
　　　　　　　　　　timer--;
　　　　　　　　　　that.val(timer + 's');
　　　　　　　　　　if(timer == 0) {
　　　　　　　　　　　　clearInterval(n);
　　　　　　　　　　　　code = true;//当倒计时为0时，即可重新发送验证码
　　　　　　　　　　　　that.val('重新发送验证码')
　　　　　　　　　　}

　　　　　　　　}, 1000)
　　　　　　}
　　　　}
　　　});

　　})
</script>