ajax信息传递.gif
知识点：数据传输--------json
jquery-----------.ajax()获取**
html部分 注意设置name属性 通过name属性从json数据中得到相应的信息
<div>
<p id="title">商品标题名称</p>
<img src="" alt="">
<p id="des">商品描述信息</p>
<button name="nz">女装</button>
<button name="bb">包包</button>
<button name="tx">拖鞋</button>
</div>
jq代码部分
$(function (){
//获取元素
var title=$("#title");
var des=$("#des");
var img=$("img");
var btn =$("button");
//添加按钮的点击事件
btn.click(function () {
var self=$(this);
$.ajax({
type:"get",
url:"10-ajax-json-proj.php",
success:function (xhr) {
var name=self.attr("name");
var obj=JSON.parse(xhr);
var subObj=obj[name];
title.html(subObj.title);
des.html(subObj.des);
img.attr("src",subObj.image);
}
})
})
})
后台获取json数据
<?php
echo file_get_contents("10-ajax-json-proj.txt");
知识点：要实现从 JSON 转换为对象，使用 JSON.parse() 方法：
var obj = JSON.parse('{"a": "Hello", "b": "World"}'); //结果是 {a: 'Hello', b: 'World'}
