JSON应用笔记二

var userName = {"rows":[{"invoice_Name":"张三"},{"invoice_Name":"李四"},{"invoice_Name":"王五"},{"invoice_Name":"马六"},{"invoice_Name":"端木"}]}

var shanghai = {"rows":[{"Hotel_No":"20258","Hotel_Name":"新苑宾馆","Hotel_Tel":"021-62426688","Hotel_Fax":"021-62428577","Hotel_Zyusyo2":"中国 上海市长宁区虹桥路1900号","lat":"31.203428","lng":"121.394189","Tiku_Shou":"changningqu","Tiku_Chu":"shanghai","Min_Kin":null,"Rating":"6","Distance":null,"AvgScore":"","PinYin":"XYBG"},{"Hotel_No":"20290","Hotel_Name":"上海大厦","Hotel_Tel":"021-63246260","Hotel_Fax":"021-63241565","Hotel_Zyusyo2":"中国 上海市虹口区北苏州路20号","lat":"31.249959","lng":"121.496465","Tiku_Shou":"hongkouqu","Tiku_Chu":"shanghai","Min_Kin":null,"Rating":"10","Distance":null,"AvgScore":"","PinYin":"SHDX"},{"Hotel_No":"17570","Hotel_Name":"华亭宾馆","Hotel_Tel":"021-64396000","Hotel_Fax":"021-64812070","Hotel_Zyusyo2":"中国 上海市徐汇区漕溪北路1200号","lat":"31.188181","lng":"121.442033","Tiku_Shou":"xuhuiqu","Tiku_Chu":"shanghai","Min_Kin":null,"Rating":"10","Distance":null,"AvgScore":"","PinYin":"HTBG"},{"Hotel_No":"32293","Hotel_Name":"房地宾馆","Hotel_Tel":"021-64458858","Hotel_Fax":"021-64458979","Hotel_Zyusyo2":"中国 上海市徐汇区武康路378号","lat":"31.212735","lng":"121.445543","Tiku_Shou":"xuhuiqu","Tiku_Chu":"shanghai","Min_Kin":null,"Rating":"5","Distance":null,"AvgScore":"","PinYin":"FDBG"},{"Hotel_No":"19035","Hotel_Name":"上海宾馆","Hotel_Tel":"021-62480088","Hotel_Fax":"021-62481310","Hotel_Zyusyo2":"中国  上海市乌鲁木齐北路505号","lat":"31.224551","lng":"121.450274","Tiku_Shou":"jinganqu","Tiku_Chu":"shanghai","Min_Kin":null,"Rating":"8","Distance":null,"AvgScore":"","PinYin":"SHBG"},{"Hotel_No":"20343","Hotel_Name":"华怡宾馆","Hotel_Tel":"021-56990999","Hotel_Fax":"021-56767042","Hotel_Zyusyo2":"中国  上海市共江路301号","lat":"31.3375","lng":"121.462187","Tiku_Shou":"baoshanqu","Tiku_Chu":"shanghai","Min_Kin":null,"Rating":"7","Distance":null,"AvgScore":"","PinYin":"HYBG"},{"Hotel_No":"69114","Hotel_Name":"天旭宾馆","Hotel_Tel":"021-68102666","Hotel_Fax":"021-68106055","Hotel_Zyusyo2":"中国 上海市浦东新区奉公路5550号","lat":"31.180198","lng":"121.7527","Tiku_Shou":"pudongxinqu","Tiku_Chu":"shanghai","Min_Kin":null,"Rating":"4","Distance":null,"AvgScore":"","PinYin":"TXBG"},{"Hotel_No":"20299","Hotel_Name":"金辰大酒店","Hotel_Tel":"021-64717000","Hotel_Fax":"021-64330566","Hotel_Zyusyo2":"中国 上海市黄浦区淮海中路795号","lat":"31.2245","lng":"121.469713","Tiku_Shou":"huangpuqu","Tiku_Chu":"shanghai","Min_Kin":null,"Rating":"6","Distance":null,"AvgScore":"","PinYin":"JCDJD"},{"Hotel_No":"19092","Hotel_Name":"绿苑大酒店","Hotel_Tel":"021-63306060","Hotel_Fax":"021-63306057","Hotel_Zyusyo2":"中国  上海市黄浦区外咸瓜街39号","lat":"31.230271","lng":"121.505572","Tiku_Shou":"huangpuqu","Tiku_Chu":"shanghai","Min_Kin":null,"Rating":"6","Distance":null,"AvgScore":"","PinYin":"LYDJD"},{"Hotel_No":"70447","Hotel_Name":"忠心大酒店","Hotel_Tel":"021-59503456","Hotel_Fax":"021-59506077","Hotel_Zyusyo2":"中国  上海市嘉定区宝安公路4568号","lat":"31.32318","lng":"121.22397","Tiku_Shou":"jiadingqu","Tiku_Chu":"shanghai","Min_Kin":null,"Rating":"5","Distance":null,"AvgScore":"","PinYin":"ZXDJD"}]}

var guangzhou = {"rows":[{"Hotel_No":"18629","Hotel_Name":"广<span class="red">东</span>大酒店","Hotel_Tel":"020-81232222","Hotel_Fax":"020-81324667","Hotel_Zyusyo2":"中国  广东省广州市长堤大马路294号","lat":"23.117447","lng":"113.265787","Tiku_Shou":"guangzhou","Tiku_Chu":"guangdong","Min_Kin":null,"Rating":"4","Distance":null,"AvgScore":"","PinYin":"GDDJD"},{"Hotel_No":"68374","Hotel_Name":"广<span class="red">东</span>南洋冠盛酒店","Hotel_Tel":"020-61398888","Hotel_Fax":"020-61002828","Hotel_Zyusyo2":"中国 广东省广州市天河区黄埔大道中天府路11号","lat":"23.13253","lng":"113.368629","Tiku_Shou":"guangzhou","Tiku_Chu":"guangdong","Min_Kin":null,"Rating":"9","Distance":null,"AvgScore":"","PinYin":"GDNYGSJD"},{"Hotel_No":"18056","Hotel_Name":"广<span class="red">东</span>胜利宾馆","Hotel_Tel":"020-81216688","Hotel_Fax":"020-81219889","Hotel_Zyusyo2":"中国 广东省广州市沙面北街53号","lat":"23.11369","lng":"113.252124","Tiku_Shou":"guangzhou","Tiku_Chu":"guangdong","Min_Kin":null,"Rating":"8","Distance":null,"AvgScore":"","PinYin":"GDSLBG"},{"Hotel_No":"18640","Hotel_Name":"广<span class="red">东</span>大厦","Hotel_Tel":"020-83339933","Hotel_Fax":"020-83339723","Hotel_Zyusyo2":"中国 广东省广州市越秀区东风中路309号","lat":"23.13802","lng":"113.273773","Tiku_Shou":"guangzhou","Tiku_Chu":"guangdong","Min_Kin":null,"Rating":"8","Distance":null,"AvgScore":"","PinYin":"GDDX"},{"Hotel_No":"18631","Hotel_Name":"广<span class="red">东</span>嘉福国际大酒店","Hotel_Tel":"020-87771688","Hotel_Fax":"020-37806140","Hotel_Zyusyo2":"中国 广东省广州市越秀区环市东路418号","lat":"23.140655","lng":"113.30075","Tiku_Shou":"guangzhou","Tiku_Chu":"guangdong","Min_Kin":260,"Rating":"7","Distance":null,"AvgScore":"","PinYin":"GDJFGJDJD"},{"Hotel_No":"25268","Hotel_Name":"广<span class="red">东</span>奥林匹克大酒店","Hotel_Tel":"020-82169999","Hotel_Fax":"020-82168681","Hotel_Zyusyo2":"中国  广东省广州市天河区东圃奥林匹克体育中心内北5门","lat":"23.125994","lng":"113.409288","Tiku_Shou":"guangzhou","Tiku_Chu":"guangdong","Min_Kin":null,"Rating":"4","Distance":null,"AvgScore":"","PinYin":"GDALPKDJD"},{"Hotel_No":"18635","Hotel_Name":"广<span class="red">东</span>新珠江大酒店","Hotel_Tel":"020-34255335","Hotel_Fax":"020-34255417","Hotel_Zyusyo2":"中国  广东省广州市滨江东路795号","lat":"23.108735","lng":"113.315042","Tiku_Shou":"guangzhou","Tiku_Chu":"guangdong","Min_Kin":null,"Rating":"8","Distance":null,"AvgScore":"","PinYin":"GDXZJDJD"},{"Hotel_No":"19030","Hotel_Name":"广<span class="red">东</span>珠岛宾馆","Hotel_Tel":"020-87190888","Hotel_Fax":"020-87190821","Hotel_Zyusyo2":"中国 广东省广州市越秀区沿江东路451号","lat":"23.118708","lng":"113.297911","Tiku_Shou":"guangzhou","Tiku_Chu":"guangdong","Min_Kin":null,"Rating":"4","Distance":null,"AvgScore":"","PinYin":"GDHBBG"},{"Hotel_No":"71428","Hotel_Name":"广<span class="red">东</span><span class="red">东</span>方国际饭店","Hotel_Tel":"020-37233888","Hotel_Fax":"020-37233446","Hotel_Zyusyo2":"中国 广东省广州市天河区广州大道中1418号","lat":"23.123245","lng":"113.321628","Tiku_Shou":"guangzhou","Tiku_Chu":"guangdong","Min_Kin":418,"Rating":"8","Distance":null,"AvgScore":"","PinYin":"GDDFGJFD"},{"Hotel_No":"69198","Hotel_Name":"广<span class="red">东</span>红叶酒店","Hotel_Tel":"020-86348988","Hotel_Fax":"020-86349008","Hotel_Zyusyo2":"中国 广东省广州市机场路西乐嘉路8号","lat":"23.174755","lng":"113.265219","Tiku_Shou":"guangzhou","Tiku_Chu":"guangdong","Min_Kin":null,"Rating":"6","Distance":null,"AvgScore":"","PinYin":"GDHYJD"}]}

var keyword = {"rows":[" 早订优惠"],"state":1,"msg":"success"}

<!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>无标题文档</title>
<style>
* {
    margin:0;
    padding:0;
}
body {
    margin:100px;
} 
</style>
</head>

<body>
    <input type="button" value="按钮" class="btn" />
<div class="box"></div>


<script src="js/jquery.min.js"></script>
<script>
    $(function(){
        $('input').click(function(){
            $.getJSON( 'invoice_Name.json',function(data,status,xhr){
                var arr = data.rows;
                var vhtml = "";
                for(var i=0;i<arr.length;i++) {
                    vhtml+=    data.rows[i].invoice_Name+'，崛起！';
                    vhtml+='<br/>';
                }
                $('.box').html(vhtml);
            })    
        });
    });
</script>
</body>
</html>

实例应用参考utravelu.com首页的酒店名模糊搜索