zoukankan      html  css  js  c++  java
  • jQuery调用ajax获取json格式数据

        <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>
    

      txt部分:

    [ 
    {"optionKey":"1", "optionValue":"Need you now"}, 
    {"optionKey":"2", "optionValue":"According to you"}, 
    {"optionKey":"3", "optionValue":"Thriller"},
    {"optionKey":"4", "optionValue":"dreadful"} 
    ] 
  • 相关阅读:
    English trip -- VC(情景课)1 A Get ready
    隔板法总结
    CF 题目选做
    ZROI 提高十连测 DAY2
    2019 09 05
    线性基总结
    解决痛苦的方法/cy
    梅深不见冬 树上贪心
    ZROI 提高十连测 Day1
    [USACO09NOV]硬币的游戏 博弈 dp
  • 原文地址:https://www.cnblogs.com/wangyeye14/p/6531073.html
Copyright © 2011-2022 走看看