PHP实现短信验证倒计时

短信验证倒计时

1. html代码

3. 登录名：<input id="phone" type="text" placeholder="用户名 / 绑定手机号码">

4. 验证码：<input type="text" id="code" placeholder="短信验证码">

5. <input type="button" id="btn" value="获取验证码"  />

9. js代码

11. <script type="text/javascript">

12. var countdown=300;//300s倒计时

13. function settime() {

16. if (countdown == 0) {

17. $("#btn").attr("disabled",false);

18. $("#btn").val("免费获取验证码");

19. countdown = 300;

20. return;

21. } else {

22. $("#btn").attr("disabled", true);

23. $("#btn").val("重新发送(" + countdown + ")");

24. countdown--;

25. }

27. //1s执行一次

28. setTimeout(function(){settime()},1000);

30. }

32. // 发送验证码

33. $("#btn").click(function () {

34. var phone = $('#phone').val();

36. if(phone==""){

37. layer.alert("手机号码不能为空", {icon: 5});

38. return false;

39. }

40. if(phone.length!==11){

41. //alert("请确认手机号位数");

42. layer.alert("手机号位数不正确", {icon: 5});

43. return false;

44. }

46. if(!(/^1[3|4|5|8][0-9]\d{4,8}$/.test(phone))){

47. //alert("不是完整的11位手机号");

48. layer.alert("手机号不合法", {icon: 5});

49. return false;

50. }

51. $.ajax({

53. type:'post',

54. dataType:'json',

55. data:{'phone':phone

56. },

57. url:"{:U('Home/User/passwordCode')}",

58. success:function (res) {

59. if(res.code==2){

60. layer.msg(res.msg, {icon: 6});

61. settime();

62. }else {

63. layer.alert(res.msg, {icon: 5});

64. }

65. }

66. });

67. });

68. <script>