<body>

    <div>点击按钮获取音乐列表</div>

    <input type="button" id="button" value="确定" />

    <div id="result"></div>

    <div>添加新的音乐</div>

    <input type="text" name="" id="" value="" />

    <input type="button" id="button2" value="添加" />

</body>
<script type="text/javascript">

    $(document).ready(function(){

        $('#button').click(function(){

            $.ajax({ 

                type:"GET", 

                url:"json/music.txt", //路径

                dataType:"json", 

                success:function(data){ 

                var music="<h2>"; 

                //i表示在data中的索引位置，n表示包含的信息的对象 

                $.each(data,function(i,n){ 

                    //获取对象中属性为optionsValue的值 

                    music+="<div>"+n["optionValue"]+"</div>"; 

                }); 

                music+="</h2>"; 

                    $('#result').append(music); 

                } 

            }); 

            return false; 

        }); 

    }); 

</script>
[

{"optionKey":"1", "optionValue":"Need you now"},

{"optionKey":"2", "optionValue":"According to you"},

{"optionKey":"3", "optionValue":"Thriller"},

{"optionKey":"4", "optionValue":"dreadful"}

]

jQuery调用ajax获取json格式数据的更多相关文章

  1. 通过Jquery中Ajax获取json文件数据

    1. JSON(JavaScript Object Notation): javaScript对象表示法: 是存储和交换文本信息的语法,比xml更小,更快,更易解析. 2. JSON基本书写格式 : ...

  2. jQuery中使用Ajax获取JSON格式数据示例代码

    JSON(JavaScript Object Notation)是一种轻量级的数据交换格式.JSONM文件中包含了关于“名称”和“值”的信息.有时候我们需要读取JSON格式的数据文件,在jQuery中 ...

  3. jQuery获取JSON格式数据方法

    getJSON方法: jQuery.getJSON(url,data,success(data,status,xhr)) $("button").click(function(){ ...

  4. springmvc4.0配置ajax请求json格式数据

    1.导入相关jar包:jackson-annotation-2.5.4.jar,jackson-core-2.5.4.jar,jackson-databind-2.5.4.jar. 2.spring- ...

  5. qt qml ajax 获取 json 天气数据示例

    依赖ajax.js类库,以下代码很简单的实现了获取天气json数据并展示的任务 [TestAjax.qml] import QtQuick 2.0 import "ajax.js" ...

  6. var dataObj=eval("("+data+")");//转换为json对象（解决在ajax返回json格式数据的时候明明正确的获取了返回值但是却就是进不去success方法的问题。格式错误）

    一,原理 1.1,解析1 将字符串解析为JavaScript代码,比如:var a = "alert('a');";这里的a就只是一个字符串而已,输出的话也是alert(a);这句 ...

  7. SpringMvc+ajax 实现json格式数据传递

    传JSON对象 前端 function test () { var param = {username : "yitop"}; $.ajax({ timeout : 20000, ...

  8. ajax 提交 json格式数据到后台

    例子:$.ajax({ type: 'POST', url: "/ROOT/modify.do", contentType: "application/json" ...

  9. 发ajax响应json格式数据

    1.maven依赖 <?xml version="1.0" encoding="UTF-8"?> <project xmlns="h ...

随机推荐

  1. ref:【干货分享】PHP漏洞挖掘——进阶篇

    ref:http://blog.nsfocus.net/php-vulnerability-mining/ [干货分享]PHP漏洞挖掘——进阶篇 王陶然     从常见的PHP风险点告诉你如何进行PH ...

  2. Python添加系统路径BASE_DIR

    Python可以使用OS模块智能添加sys.path,需要放在Start.py的开始 import os import sys if __name__== '__main__': BASE_DIR = ...

  3. redis优化方案

    流水线(pipelined) 批量提交redis命令,减少通信次数 事务 mulit,事务的开始 exec,执行事务快内的命令 discard,放弃事务快内的命令 watch,监视key,如果key改 ...

  4. svn代码同步脚本

    碰到一个需求,主要是2个项目需要用到同一份代码,主要是域名和配置信息不一样,而且要把svn更新的代码同步过去.本来考虑提交时用钩子同步过去,但考虑到同步过去的代码还需要测试,而且另一边代码的时效性不强 ...

  5. Poj1741/洛谷P4718 Tree（点分治）

    题面 有多组数据:Poj 无多组数据:洛谷 题解 点分治板子题,\(calc\)的时候搞一个\(two\ pointers\)扫一下统计答案就行了. #include <cmath> #i ...

  6. jsp有哪些内置对象作用分别是什么 分别有什么方法？

    JSP共有以下9个内置的对象: request 用户端请求,此请求会包含来自GET/POST请求的参数 response 网页传回用户端的回应 pageContext 网页的属性是在这里管理 sess ...

  7. 洛谷P1149 火柴棒等式

    题目描述 给你n根火柴棍,你可以拼出多少个形如“A+B=C”的等式?等式中的A.B.C是用火柴棍拼出的整数(若该数非零,则最高位不能是0).用火柴棍拼数字0-9的拼法如图所示: 注意: 1.加号与等号 ...

  8. 51Nod1962 区间计数

    这题与之前那道区间最值的题非常类似,依旧是二分区间,然后统计跨过中间点的区间贡献. 我们要选出小于等于和小于的,这样就可以算出相等的区间长了. 复杂度O(nlogn) By:大奕哥 #include& ...

  9. BZOJ1509 [NOI2003]逃学的小孩 树型DP

    题目: 分析: 首先明确我们是要求 min(dist[C][A],dist[C][B])+dist[A][B]. 我们把C当成树根,第一我们可以发现min里面取dist[C][A]或者dist[C][ ...

  10. Educational Codeforces Round 11 B. Seating On Bus 水题

    B. Seating On Bus 题目连接: http://www.codeforces.com/contest/660/problem/B Description Consider 2n rows ...