php数据库数据转换为js中的json对象,JSON.parse()和JSON.stringify()
<span style="font-family:Arial, Helvetica, sans-serif;"><span style="white-space: normal;">
</span></span><?php
/
1.在company数据user表中取出10条数据，保存为数组
2.在将数组转化为json格式，传递给js
3.用json解析器将传递过来的json字符串转化为json对象,
4.用document.write输出语句打印在页面上
*/
$conn = mysql_connect(“localhost”,”root”,”root”); //连接数据库
mysql_query(“set names utf8″); //设置编码
mysql_select_db(“company”,$conn); //选择库
$sql = “select * from user limit 10″; //在user表中查询10条数据
$res = mysql_query($sql); //执行sql语句
$arr = array();
while($row = mysql_fetch_array($res,MYSQL_ASSOC)){ //查询出来sql
$arr[] = $row; //将查询出来的结果赋给数组$arr
}
$str = json_encode($arr); //将数组转化为json格式的字符串
?>
<script src=”json_parse.js”></script> <!– 引入json解析器 –>
<table>
<tr>
<th>uid</th><th>用户名</th><th>性别</th><th>email</th>
</tr>
<script>
var jsonString = ‘<?php echo $str;?>’; //传递php中的数据给js
//document.write(jsonString);
var jsonObject = json_parse(jsonString); //将json字符串转化为js中的json对象
for(var i = 0; i < jsonObject.length; i++){ //for循环打印
document.write(“<tr>”);
document.write(“<td>”,jsonObject[i].uid,”</td>”);
document.write(“<td>”,jsonObject[i].username,”</td>”);
document.write(“<td>”,jsonObject[i].sex,”</td>”);
document.write(“<td>”,jsonObject[i].email,”</td>”);
document.write(“</tr>”);
}
</script>
</table></pre><pre code_snippet_id="1946467" snippet_file_name="blog_20161024_1_275959" name="code" class="html">
parse用于从一个字符串中解析出json对象,如
var str = "{"name":"huangxiaojian","age":"23"}"
结果：
JSON.parse(str)
Object
- age: "23"
- name: "huangxiaojian"
- __proto__: Object
stringify()用于从一个对象解析出字符串，如
var a = {a:1,b:2}
结果：
JSON.stringify(a)
"{"a":1,"b":2}"
===============================
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<link href="/tv/areaList/css/mobile.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="/tv/areaList/js/jquery.js"></script>
<title>手机商城-区域导航</title>
<script type="text/javascript">
function sea(){
//alert("ssss");
//var x=<?php
//echo json_encode($area);
//?>;
var x=<?php echo json_encode($area);?>;
//alert(x);
var k=$("#kv").val();//获取input的值
var y=[];
var n=0;
var t="";
for(var i=0;i<x.length;i++){
//t="-"+x[i].areaname;
t=","+x[i].areaname; //把areaname值复制给一个空字符串变量
//alert(t);
if(t.indexOf(k)>0){//indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。 -1是没有出现
y[n]=x[i];
n++;
}
}
$("#listx").html("");
for (var i=0;i<y.length;i++){
t=$("#listx").html();
$("#listx").html(t+"<p><a href="searchResult.php?areaid="+y[i].areaid+"">"+y[i].areaname+"</a></p>");
}
//alert(JSON.stringify(y));
}
</script>
</head>
<body style="">
<!--alla-->
<div class="alla">
<a class="aa" herf="javascript:sea();"> < </a>
<a class="bb" ><a href="javascript:sea();" style="float:right;"><img src="/tv/areaList/images/all_b.png" width="28"></a></a>
<a class="cc">区域导航<input id="kv" value="" type="text" style="width:150px;"/></a>
<p>
<a href="">商品列表</a>
<a href="">服务列表</a>
</p>
</div>
<script>
$(".alla a.bb").click(function(){if($(".alla p").css("display")=="none"){$(".alla p").show();}else{$(".alla p").hide();}});
</script>
<!--map-->
<div class="map" id="listx">
<p>
<?php foreach($area as $v){
echo "<a href="searchResult.php?areaid=".$v["areaid"]."">".$v["areaname"]."</a>";
}
?>
</p>
</div>
<!--footer-->
<div class="footer">
<a href="#"><img src="/tv/wap/images/index_za.png" width="16"><span>首页</span></a>
<a href="/member/index.php?wap=1"><img src="/tv/wap/images/index_zb.png" width="16"><span>我的账户</span></a>
<a href="/mall/cart.php?wap=1"><img src="/tv/wap/images/index_zc.png" width="16"><span>购物车</span></a>
<a href="/mobile/searchResult.php?catid=0"><img src="/tv/wap/images/index_zd.png" width="16"><span>公告</span></a>
<a href="tel:400-072-9290"><img src="/tv/wap/images/index_ze.png" width="16"><span>客服</span></a>
</div>
</body>
</html>
- 上一篇： js表单提交后，如何获取表单中的数据并显示出来
- 下一篇：没有了
