相思资源网 Design By www.200059.com
JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。
简而论之,不管是xml还是json都是为了方便在客户端与服务器端交互数据的中转站,特别是用于对象型数据,比如最常见的数组。
下面将分别将数组从php传送给javascript,以及将数组从javascript传送给php示例说明,例子比较简单,明白概念即可。不管从php传送给javascript,还是javascript传送给php,json在传送之前都会将对象扁平化即一维化为字符串。
PHP 向 JavaScript 传值
PHP 文件 json.php
复制代码 代码如下:
<?php
$arr = array(
'name' => '',
'nick' => 'Gonn',
'contact' => array(
'email' => 'xxxxxxx@163.com',
'website' => 'https://www.jb51.net',
)
);
$json_string = json_encode($arr);
echo "getProfile($json_string)";
?>
光执行这个文件,其结果如下:
复制代码 代码如下:
getProfile({"name":"u5e0cu4e9a","nick":"Gonn",
"contact":{"email":"xxxxxxx@163.com","website":"https://www.jb51.net"}})
json.php 是通过 json_encode 函数将数组扁平化,然后发送,相反有个 json_decode 函数。
那么在 JavaScript 如何调用呢?很简单,定义一个变量获取 PHP 传来的 Json,该 Json 具备对象的特性,我们可以用 array.name 这种方式来获取该 Json 的属性。
复制代码 代码如下:
<script type="text/javascript">
function getProfile(str) {
var arr = str;
document.getElementById('name').innerHTML = arr.name;
document.getElementById('nick').innerHTML = arr.nick;
document.getElementById('email').innerHTML = arr.contact.email;
document.getElementById('website').innerHTML = arr.contact.website;
}
</script>
<body>
<div id="name"></div>
<div id="nick"></div>
<div id="email"></div>
<div id="website"></div>
</body>
<script type="text/javascript" src="/UploadFiles/2021-04-02/json.php">
运行结果如下:
复制代码 代码如下:
Gonn
xxxxxxx@163.com
https://www.jb51.net
JavaScript 向 PHP 传值
json_encode.html
复制代码 代码如下:
<!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>json:From javascript To php</title>
<script src="/UploadFiles/2021-04-02/json2.js"> <script type="text/javascript">
function JSON_test(o)
{
var user = {
name:document.getElementById('txt_name').value,
email:document.getElementById('txt_email').value,
password:document.getElementById('txt_password').value
}
var json_string = JSON.stringify(user);
document.getElementById('txt_json').value=json_string;
alert("点击确定后将提交表单");
o.submit();
}
</script>
</head>
<body>
<form id="form1" name="form1" method="post" action="json_encode.php"onsubmit="JSON_test(this);return flase;">
<label for="txt_name">姓名</label>
<p><input type="text" name="txt_name" id="txt_name" /></p>
<label for="txt_email">邮箱</label>
<p><input type="text" name="txt_email" id="txt_email" /></p>
<p><label for="txt_password">密码</label></p>
<p><input type="text" name="txt_password" id="txt_password" /></p>
<p><input type="text" name="txt_json" id="txt_json" />
<label for="button"></label>
<input type="submit" name="button" id="button" value="JSON" />
</p>
</form>
</body>
</html>
这里javascript扁平化需要一个插件:http://www.json.org/json2.js,通过JSON.stringify(str)将对象扁平化然后传送给php。
注:另有一个http://www.json.org/json.js,对应的是toJSONString方法。
复制代码 代码如下:
var last=obj.toJSONString(); //针对json.js
var last=JSON.stringify(obj); //针对json2.js
json_encode.php
复制代码 代码如下:
<?php
header('Content-Type: text/html; charset=utf-8');
$json_string = $_POST["txt_json"];
//echo $json_string;
if(ini_get("magic_quotes_gpc")=="1")
{
$json_string=stripslashes($json_string);
}
$user = json_decode($json_string);
echo var_dump($user);
echo '<br /><br /><br /><br />';
echo $user->name.'<br />';
echo $user->email.'<br />';
echo $user->password.'<br />';
?>
这里就需要用到json_decode()这个函数,然后调用其中数据用 $obj->属性即可。
简而论之,不管是xml还是json都是为了方便在客户端与服务器端交互数据的中转站,特别是用于对象型数据,比如最常见的数组。
下面将分别将数组从php传送给javascript,以及将数组从javascript传送给php示例说明,例子比较简单,明白概念即可。不管从php传送给javascript,还是javascript传送给php,json在传送之前都会将对象扁平化即一维化为字符串。
PHP 向 JavaScript 传值
PHP 文件 json.php
复制代码 代码如下:
<?php
$arr = array(
'name' => '',
'nick' => 'Gonn',
'contact' => array(
'email' => 'xxxxxxx@163.com',
'website' => 'https://www.jb51.net',
)
);
$json_string = json_encode($arr);
echo "getProfile($json_string)";
?>
光执行这个文件,其结果如下:
复制代码 代码如下:
getProfile({"name":"u5e0cu4e9a","nick":"Gonn",
"contact":{"email":"xxxxxxx@163.com","website":"https://www.jb51.net"}})
json.php 是通过 json_encode 函数将数组扁平化,然后发送,相反有个 json_decode 函数。
那么在 JavaScript 如何调用呢?很简单,定义一个变量获取 PHP 传来的 Json,该 Json 具备对象的特性,我们可以用 array.name 这种方式来获取该 Json 的属性。
复制代码 代码如下:
<script type="text/javascript">
function getProfile(str) {
var arr = str;
document.getElementById('name').innerHTML = arr.name;
document.getElementById('nick').innerHTML = arr.nick;
document.getElementById('email').innerHTML = arr.contact.email;
document.getElementById('website').innerHTML = arr.contact.website;
}
</script>
<body>
<div id="name"></div>
<div id="nick"></div>
<div id="email"></div>
<div id="website"></div>
</body>
<script type="text/javascript" src="/UploadFiles/2021-04-02/json.php">
运行结果如下:
复制代码 代码如下:
Gonn
xxxxxxx@163.com
https://www.jb51.net
JavaScript 向 PHP 传值
json_encode.html
复制代码 代码如下:
<!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>json:From javascript To php</title>
<script src="/UploadFiles/2021-04-02/json2.js"> <script type="text/javascript">
function JSON_test(o)
{
var user = {
name:document.getElementById('txt_name').value,
email:document.getElementById('txt_email').value,
password:document.getElementById('txt_password').value
}
var json_string = JSON.stringify(user);
document.getElementById('txt_json').value=json_string;
alert("点击确定后将提交表单");
o.submit();
}
</script>
</head>
<body>
<form id="form1" name="form1" method="post" action="json_encode.php"onsubmit="JSON_test(this);return flase;">
<label for="txt_name">姓名</label>
<p><input type="text" name="txt_name" id="txt_name" /></p>
<label for="txt_email">邮箱</label>
<p><input type="text" name="txt_email" id="txt_email" /></p>
<p><label for="txt_password">密码</label></p>
<p><input type="text" name="txt_password" id="txt_password" /></p>
<p><input type="text" name="txt_json" id="txt_json" />
<label for="button"></label>
<input type="submit" name="button" id="button" value="JSON" />
</p>
</form>
</body>
</html>
这里javascript扁平化需要一个插件:http://www.json.org/json2.js,通过JSON.stringify(str)将对象扁平化然后传送给php。
注:另有一个http://www.json.org/json.js,对应的是toJSONString方法。
复制代码 代码如下:
var last=obj.toJSONString(); //针对json.js
var last=JSON.stringify(obj); //针对json2.js
json_encode.php
复制代码 代码如下:
<?php
header('Content-Type: text/html; charset=utf-8');
$json_string = $_POST["txt_json"];
//echo $json_string;
if(ini_get("magic_quotes_gpc")=="1")
{
$json_string=stripslashes($json_string);
}
$user = json_decode($json_string);
echo var_dump($user);
echo '<br /><br /><br /><br />';
echo $user->name.'<br />';
echo $user->email.'<br />';
echo $user->password.'<br />';
?>
这里就需要用到json_decode()这个函数,然后调用其中数据用 $obj->属性即可。
相思资源网 Design By www.200059.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
相思资源网 Design By www.200059.com
暂无用Json实现PHP与JavaScript间数据交换的方法详解的评论...
《魔兽世界》大逃杀!60人新游玩模式《强袭风暴》3月21日上线
暴雪近日发布了《魔兽世界》10.2.6 更新内容,新游玩模式《强袭风暴》即将于3月21 日在亚服上线,届时玩家将前往阿拉希高地展开一场 60 人大逃杀对战。
艾泽拉斯的冒险者已经征服了艾泽拉斯的大地及遥远的彼岸。他们在对抗世界上最致命的敌人时展现出过人的手腕,并且成功阻止终结宇宙等级的威胁。当他们在为即将于《魔兽世界》资料片《地心之战》中来袭的萨拉塔斯势力做战斗准备时,他们还需要在熟悉的阿拉希高地面对一个全新的敌人──那就是彼此。在《巨龙崛起》10.2.6 更新的《强袭风暴》中,玩家将会进入一个全新的海盗主题大逃杀式限时活动,其中包含极高的风险和史诗级的奖励。
《强袭风暴》不是普通的战场,作为一个独立于主游戏之外的活动,玩家可以用大逃杀的风格来体验《魔兽世界》,不分职业、不分装备(除了你在赛局中捡到的),光是技巧和战略的强弱之分就能决定出谁才是能坚持到最后的赢家。本次活动将会开放单人和双人模式,玩家在加入海盗主题的预赛大厅区域前,可以从强袭风暴角色画面新增好友。游玩游戏将可以累计名望轨迹,《巨龙崛起》和《魔兽世界:巫妖王之怒 经典版》的玩家都可以获得奖励。