jquery使用淘宝接口跨域查询手机号码归属地实例


Posted in Javascript onNovember 28, 2013
    <h1>手机号码归属地查询</h1>
    <div class="outer">
        <p>请输入手机号码</p>
        <input type="text"  >
        <span class="button">查询</span>
        <span class="error">号码有误 或 无数据</span>
        <ul>
            <li class="num">手机号码: <span></span></li>            
            <li class="province">归属省份: <span></span></li>
            <li class="operators">运 营 商: <span></span></li>
        </ul>
    </div>
<script type="text/javascript" src="query.js" ></script>
<script>

    var tel;
    var ajax=function(){
        //淘宝接口    
        $.ajax({
             type: "get",
             url: 'http://tcc.taobao.com/cc/json/mobile_tel_segment.htm?tel='+tel,
             dataType: "jsonp",
             jsonp: "callback",
             success: function(data){
                console.log(data);
                $('.error').css('display','none');
                var province = data.province,
                    operators = data.catName,
                    num = data.telString;
                $('.num span').html(num);
                $('.province span').html(province);
                $('.operators span').html(operators);
             },
             error:function (){    
                $('li span').html('');
                $('.error').css('display','block');        
             }
         });
    }
    
    var reg = /^(13|15|18)[0-9]{9}$/;//点击查询
    $('.button').click(function(){
        tel=$('input[type=text]').val();
        if(tel){
            if(reg.test(tel)){
                ajax();
            }else{
                $('li span').html('');
                $('.error').css('display','block');    
            }
        }
    });
    //键盘事件
    $(window).keydown(function(event){
        tel=$('input[type=text]').val();
        if(event.keyCode==13) {
            if(tel){
                if(reg.test(tel)){
                    ajax();
                }else{
                    $('li span').html('');
                    $('.error').css('display','block');    
                }
            }
        }
    });
</script>
Javascript 相关文章推荐
js cookies 常见网页木马挂马代码 24小时只加载一次
Apr 13 Javascript
jquery实现心算练习代码
Dec 06 Javascript
jQuery关于导航条背景切换效果实现示例
Sep 04 Javascript
全面解析Bootstrap弹窗的实现方法
Dec 01 Javascript
js绑定事件和解绑事件
Apr 27 Javascript
js注册时输入合法性验证方法
Oct 21 Javascript
详解webpack运行Babel教程
Jun 13 Javascript
Vue 实现列表动态添加和删除的两种方法小结
Sep 07 Javascript
webstorm+vue初始化项目的方法
Oct 18 Javascript
JavaScript中的事件与异常捕获详析
Feb 24 Javascript
javascript面向对象三大特征之继承实例详解
Jul 24 Javascript
layui: layer.open加载窗体时出现遮罩层的解决方法
Sep 26 Javascript
JS小功能(checkbox实现全选和全取消)实例代码
Nov 28 #Javascript
JS小功能(onmouseover实现选择月份)实例代码
Nov 28 #Javascript
JS小功能(setInterval实现图片效果显示时间)实例代码
Nov 28 #Javascript
JS小功能(操作Table--动态添加删除表格及数据)实现代码
Nov 28 #Javascript
JS小功能(offsetLeft实现图片滚动效果)实例代码
Nov 28 #Javascript
JS小功能(列表页面隔行变色)简单实现
Nov 28 #Javascript
jQuery计算textarea中文字数(剩余个数)的小程序
Nov 28 #Javascript
You might like
PHP输出XML到页面的3种方法详解
2013/06/06 PHP
PHP获取访问设备信息的方法示例
2019/02/20 PHP
Laravel框架文件上传功能实现方法示例
2019/04/16 PHP
PHP中的输出echo、print、printf、sprintf、print_r和var_dump的示例代码
2020/12/01 PHP
Javascript 表单之间的数据传递代码
2008/12/04 Javascript
实现超用户体验 table排序javascript实现代码
2009/06/22 Javascript
用js解决数字不能换行问题
2010/08/10 Javascript
JQuery的read函数与js的onload不同方式实现
2013/03/18 Javascript
chrome下img加载对height()的影响示例探讨
2014/05/26 Javascript
jQuery中triggerHandler()方法用法实例
2015/01/19 Javascript
JavaScript中使用Object.prototype.toString判断是否为数组
2015/04/01 Javascript
JavaScript弹出新窗口后向父窗口输出内容的方法
2015/04/06 Javascript
基于JavaScript实现div层跟随滚动条滑动
2016/01/12 Javascript
Javascript获取图片原始宽度和高度的方法详解
2016/09/20 Javascript
QRCode.js:基于JQuery的生成二维码JS库的使用
2017/06/23 jQuery
javascript cookie的基本操作(添加和删除)
2017/07/24 Javascript
浅谈JS中的反柯里化( uncurrying)
2017/08/17 Javascript
Vue-cli创建项目从单页面到多页面的方法
2017/09/20 Javascript
微信小程序控制台提示warning:Now you can provide attr &quot;wx:key&quot; for a &quot;wx:for&quot; to improve performance解决方法
2019/02/21 Javascript
jsonp实现百度下拉框功能的方法分析
2019/05/10 Javascript
利用PyInstaller将python程序.py转为.exe的方法详解
2017/05/03 Python
Python安装lz4-0.10.1遇到的坑
2018/05/20 Python
浅谈Python的条件判断语句if/else语句
2019/03/21 Python
Django中F函数的使用示例代码详解
2020/07/06 Python
Python分类测试代码实例汇总
2020/07/23 Python
Python学习之time模块的基本使用
2021/01/17 Python
数以千计的折扣工业产品:ESE Direct
2018/05/20 全球购物
莫斯科珠宝厂官方网站:Miuz
2020/09/19 全球购物
HR求职自荐信范文
2014/06/21 职场文书
革命英雄事迹演讲稿
2014/09/13 职场文书
2014镇党委班子对照检查材料思想汇报
2014/09/23 职场文书
幼儿园开学家长寄语(2016秋季)
2015/12/03 职场文书
JS一分钟在github+Jekyll的博客中添加访问量功能的实现
2021/04/03 Javascript
python3实现常见的排序算法(示例代码)
2021/07/04 Python
Mysql超详细讲解死锁问题的理解
2022/04/01 MySQL
升级 Win11 还是坚守 Win10?微软 Win11 新系统缺失功能大盘点
2022/04/05 数码科技