首页 » Web前端 » html传参给php技巧_解析HTMLJS与PHP之间的数据传输

html传参给php技巧_解析HTMLJS与PHP之间的数据传输

访客 2024-11-03 0

扫一扫用手机浏览

文章目录 [+]

图1 HTML、JS与PHP之间的数据传输流程图

以加入商品到购物车为例,本例为仿照数据,和实际的数据库的数据不同。

html传参给php技巧_解析HTMLJS与PHP之间的数据传输 html传参给php技巧_解析HTMLJS与PHP之间的数据传输 Web前端

图2 商品列表

html传参给php技巧_解析HTMLJS与PHP之间的数据传输 html传参给php技巧_解析HTMLJS与PHP之间的数据传输 Web前端
(图片来自网络侵删)

加入购物车的点击事宜大致步骤为:用户点击\"大众加入购物车\公众按钮==>页面获取当前商品唯一值(如商品ID:productID)==>JS处理点击事宜,将唯一值连同用户信息通过ajax要求传送给PHP===>PHP向做事器要求连接===>数据库语句实行===>做事器将实行结果返回给PHP===>PHP将实行结果传送给前端。

如果数据库语句实行成功,那么数据库中该用户的购物车表就多了一项刚加入的商品数据,同时做事器也会向PHP返回实行成功信息(及一条不为空的数据串),而用户的界面就会显示\公众成功加入购物车\公众等字样(如图1-1所示);若实行失落败,也会将失落败信息(err)传给PHP,用户界面也会显示相应的提示,如图3所示。

图3 成功加入购物车提示

1. HTML中的代码实例,商品列表信息通过引入art-template模块进行渲染,代码如下

<ul class=\"大众productContainer\公众>

{{each product prod}}

<li>

<input type=\"大众text\"大众 value=\公众{{prod.id}}\"大众>

<img src=\"大众{{prod.img}}\公众/>

<p>{{prod.title}}</p>

<span>¥{{prod.price}}</span>

<a href=\"大众javascript:void(0)\"大众>加入购物车</a>

</li>

{{/each}}

</ul>

2. JS中的数据要求处理实例如下,加入购物车的要求的api文件路径为http://localhost/api/add.php,此时将点击加入的商品ID及操作的用户ID封装为工具,用ajax的post要求传给做事端

$(\"大众.productContainer\"大众).on(\公众click\公众, \"大众.add\公众, function () {

var productID=$(\"大众#prodID\公众).val();//获取到当前商品的ID值

$.post(\"大众http://localhost/api/add.php\"大众, {productID:productID,userID},

function (data) {

if (data.res_code === 1) { //返回的数据中,data.res_code为1表示加入成功

alert(\"大众加入成功\"大众);//对用户进行加入成功提示

} else {

alert(data.res_message);//若不为1则表示加入失落败,data.res_message为失落败信息

}

}, \"大众json\"大众);

});

3. PHP中的代码(及JS中所要求的add.php文件)

<?php

// CORS跨域

header(\公众Access-Control-Allow-Origin:\"大众);

/ 向购物车添加商品 /

$productID = $_POST[\"大众productID\公众];

$userid = $_POST[\公众userID\公众];

// 连接数据库做事器

mysql_connect(\"大众localhost:3306\公众, \"大众root\公众, \"大众\"大众);

// 选择连接数据库的名称

mysql_select_db(\"大众cart\公众);

// 读写库编码

mysql_query(\"大众set character set utf8\公众);

mysql_query(\"大众set names utf8\"大众);

// 编写SQL语句

//若该用户未添加该商品,则向cartList表插入该商品,并将数量置为1

$sql1 = \公众INSERT INTO cartList(productID, userID,count) VALUES ('$productID', '$userID',1)\"大众;

//若该用户已添加该商品,再次添加时只在cartList表中让该商品的数量+1

$sql2 = \"大众UPDATE cartList SET count=count+1 WHERE productID= '$productID' AND userid='$userID'\"大众;

// 实行SQL语句,首先实行sql1的语句,如果表中有相同的数据,则sql1会实行失落败,那么实行sql2

$result = mysql_query($sql1);

if(!$result){

$result = mysql_query($sql2);

}

// 判断

if ($result) { // 实行成功,将res_code的值设为1,并将返复书息设置为\"大众加入成功\"大众

$arr = array(\公众res_code\"大众=>1, \"大众res_message\"大众=>\"大众加入成功\"大众);

echo json_encode($arr);

} else { // 实行失落败,则将res_code设为0,并将缺点信息设置为\公众加入失落败\公众

$arr = array(\"大众res_code\"大众=>0, \"大众res_message\"大众=>\"大众加入失落败\公众 . mysql_error());

echo json_encode($arr);

}

// 关闭连接

mysql_close();

?>

4. 当用户进入购物车时,页面要要求该用户在数据库中的购物车表cartList,此时查询结果该当为一个数组,数组里的每一个子元素对应一个唯一的商品工具,数据库查询语句如下:

// 编写SQL语句

//在购物车cartList表中找到该用户已经添加的购物车商品数据的信息

$sql = \"大众SELECT FROM cartList WHERE userID='$userID'\"大众;

// 实行SQL语句

$result = mysql_query($sql);

// 新建一个数组用来存查询出来的结果,每条结果仅有一条商品的信息

$results = array();

// 每次查询成功,将当前查询到的商品结果存入results数组中

while($row = mysql_fetch_row($result))

{

$results[] = $row;

}

if ($results) {//返回数组$results,res_code值设为1

$arr = array(\"大众res_code\公众=>1, \"大众res_message\"大众=>$results);

echo json_encode($arr);

}

else { // 查找失落败,返复书息\"大众查找失落败\"大众,res_code值设为0

$arr = array(\"大众res_code\"大众=>0, \公众res_message\"大众=>\公众查找失落败\"大众 . mysql_error());

echo json_encode($arr);

}

关于PHP语法的解释:

mysql_query() 函数实行某个针对数据库的查询,每次查询结果仅有一条数据。

mysql_fetch_row() 从和结果标识 data 关联的结果集中取得一行数据并作为数组返回。
每个结果的列储存在一个数组的单元中,偏移量从 0 开始。
依次调用 mysql_fetch_row() 将返回结果集中的下一行,如果没有更多行则返回 FALSE。

标签:

相关文章

i颜色设计,打造个性空间,诠释生活美学

随着社会经济的不断发展,人们对生活品质的追求越来越高,个性化和美观性成为了家居设计的关键词。在这个追求品质生活的时代,i颜色设计应...

Web前端 2024-12-05 阅读0 评论0

J平台,打造大型网站的典范与创新之路

随着互联网技术的飞速发展,我国大型网站如雨后春笋般涌现,而J平台作为其中佼佼者,凭借其独特的技术实力、丰富的内容资源以及卓越的用户...

Web前端 2024-12-05 阅读0 评论0

MJI设计,引领现代设计潮流的创新力量

随着科技的飞速发展,设计行业也在不断创新变革。在这个充满挑战与机遇的时代,MJI设计凭借其独特的创新理念与卓越的设计能力,成为了现...

Web前端 2024-12-05 阅读0 评论0

MSN程序,引领即时通讯革命的先锋之作

随着互联网的飞速发展,即时通讯工具逐渐成为人们生活中不可或缺的一部分。在众多即时通讯软件中,MSN以其独特的魅力和卓越的性能,成为...

Web前端 2024-12-05 阅读0 评论0

num,数字的力量与魅力

数字,作为人类语言的一种特殊形式,承载着丰富的信息与意义。从古至今,人类对数字的研究从未停止,它已成为我们生活中不可或缺的一部分。...

Web前端 2024-12-05 阅读0 评论0