【web前端攻城狮】表单验证之电话验证

我们这里要用到的是淘宝电话验证接口，先给个图片

url:"https://tcc.taobao.com/cc/json/mobile_tel_segment.htm?tel="+$("#rg-inputphone").val()

用这种方式，在用户注册的时候会让产品形象更好，更有依赖感

 $("#rg-inputphone").on("blur", function() {
      testInputPhone();
    });
    function testInputPhone() {
      var reg = /^((\d{11})|^((\d{7,8})|(\d{4}|\d{3})-(\d{7,8})|(\d{4}|\d{3})-(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1})|(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1}))$)$/;
      if (reg.test($("#rg-inputphone").val())) {
        $.ajax({
          url:
            "https://tcc.taobao.com/cc/json/mobile_tel_segment.htm?tel=" +
            $("#rg-inputphone").val(),
          dataType: "jsonp",
          jsonp: "callback",
          success: function(response) {
            if (response.mts) {
              $("#testPhoneTips").text(response.carrier);
              $("#rg-inputphone").css("border", "none");
              flagRegister05 = 1;
            } else {
              $("#testPhoneTips").text("该手机号码不存在");
              flagRegister05 = 0;
              $("#rg-inputphone").css("border", "solid 1px #b00");
            }
          },
          error: function(msg) {
            $("#testPhoneTips").text("手机号码不存在");
          }
        });
        $("#rg-inputphone").css("border", "none");
        $("#testPhoneTips").text("");
        flagRegister05 = 1;
      } else if ($("#rg-inputphone").val() == "") {
        $("#rg-inputphone").css("border", "none");
        $("#testPhoneTips").text("");
        flagRegister05 = 1;
      } else {
        $("#rg-inputphone").css("border", "solid 1px #b00");
        flagRegister05 = 0;
        $("#testPhoneTips").text("请输入正确的电话号码");
      }
    }

希望可以对大家有帮助