5450人阅读
服务器（5）
希望查看本篇文章的学者首先查看一下php的基础知识,因为今天用到这个东西,现学现卖吧.后续会更新php服务器的基础知识!
1.首先你要有一个界面 & 我这里利用我项目开发的一个简单界面截取下来进行讲解!项目机密 &请勿**,你懂得!
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&&
&meta http-equiv=&Content-Type& content=&text/ charset=utf-8&/&
&title&百姓商城&/title&
&link href=&/css/newindex4.css?v=.css& rel=&stylesheet& type=&text/css&
media=&screen&&
&script type=&text/javascript& src=&jquery-3.0.0.min.js&&&/script&
&div class=&newindex_box mar_t_10 clearfix&&
&div class=&index_hot_sale&&
&ul class=&hot_sale_ul& id=&hot_sale&&
&li class=&hot_sale_li left& style=&margin-right:0&&
&div class=&pic&&&a style=&width:260height:172&
href=&/item/05c044a508ade00f539be3e0a3.htm&
title=& &&&img style=&width:260height:172& alt=&维多利陶瓷 自然石系列&
src=&/system/cfe00463b0acfe04c9d9be3e0a3.jpg&&&/a&
&p class=&tit&&&a href=&/item/05c044a508ade00f539be3e0a3.htm&
title=&&&&/a&&/p&
&div class=&price&&&span class=&right&&预订：&b class=&yd_num&&44&/b&件&/span&&span
class=&bx_price&&￥62.1&/span&&span class=&store_price&&￥128&/span&&/div&
&/pre&&pre name=&code& class=&html&&上面的代码li部分其实是有八个 实现的是这样的界面
因为li代码都是一样的 所以就不一一列举了 大家明白就行了
ok 这里的都明白;下面就是用ajax进行交互 就是js的代码
在下面进行加入一个js的代码块
&pre name=&code& class=&javascript&&&script type=&text/javascript&&
var str=&&;
type:&post&,
url:&postDemo.php&,
&code&:&201&,
&user&:&admin&
success:function(data){
var result=eval(&(&+data+&)&);
alert(data);
for(var i=0;i&result.i++){
if ((i+1)%4){
var str = &&li class='hot_sale_li left' && +
&&div class='pic'&&a style='width:260height:172' href='& + result[i].titleURL + &' title='维多利陶瓷 自然石系列'&&img style='width:260height:172' alt='& + result[i].title + &' src='& + result[i].imgURL + &' /&&/a&&/div&& +
&&p class='tit'&&a href='& + result[i].titleURL + &' title='& + result[i].title + &'&& + result[i].title + &&/a&&/p&& +
&&div class='price'&&span class='right'&预订：&b class='yd_num'&& + result[i].number + &&/b&件&/span&&span class='bx_price'&￥& + result[i].Nprice + &&/span&&span class='store_price'&￥& + result[i].Oprice + &&/span&&/div& &/li&&
var str = &&li class='hot_sale_li left'style='margin-right: 0px' && +
&&div class='pic'&&a style='width:260height:172' href='& + result[i].titleURL + &' title='维多利陶瓷 自然石系列'&&img style='width:260height:172' alt='& + result[i].title + &' src='& + result[i].imgURL + &' /&&/a&&/div&& +
&&p class='tit'&&a href='& + result[i].titleURL + &' title='& + result[i].title + &'&& + result[i].title + &&/a&&/p&& +
&&div class='price'&&span class='right'&预订：&b class='yd_num'&& + result[i].number + &&/b&件&/span&&span class='bx_price'&￥& + result[i].Nprice + &&/span&&span class='store_price'&￥& + result[i].Oprice + &&/span&&/div& &/li&&
$(& .index_hot_sale #hot_sale&).append(str);
var oneTitle = result[i].
$(&.hot_sale_ul li:eq(&+i+&) a&).attr(&title&,result[i].title);
$(&.hot_sale_ul li:eq(&+i+&) a&).attr(&title&,result[i].title);
&p&&/pre&&p&上面的ajax的几个属性大家映带都懂  我简单说一下  type就是提交的方式  一共有post和get两种 我用的是post&/p&&p&url就是服务器php的路径就是提交数据到的地址,data就是我们提交的数据,就是进行向服务器进行提交,然后服务器代码就是以下代码:&/p&&p&&/p&&p&&pre name=&code& class=&php&&&?php&/p&/**
* Created by PhpStorm.
* User: Administrator
* Time: 17:28
include &data.php&;
if($_POST[&code&]==201 && $_POST[&user&]==&admin&){
echo json_encode(array(&code&=&111)) ;
echo json_encode($hotSale);
echo json_encode(array(&code&=&402));
echo json_encode($hotSale);
服务器的代码 include进来的php文件就是存储数据的一个php文件下面会附上代码;我解释一下这个简单的服务器端的代码
if($_POST[&code&]==201 && $_POST[&user&]==&admin&){
echo json_encode(array(&code&=&111)) ;
echo json_encode($hotSale);
}这个判断就是对客户端那边发过来的数据进行的判断 &如果code和user都正确 &则给你返回数据 &如果不等几返回
echo json_encode(array(&code&=&402));
echo json_encode($hotSale);
这是在开发中和服务器端的同事商量定下来的
下面我说一下正确的时候返回来的数据
&pre name=&code& class=&php&&echo json_encode($hotSale);
就是这句 echo大家都知道是php里面的关键字 ,json_encode就是获取我们加载 data.php
&pre name=&code& class=&php&&&?php
* Created by PhpStorm.
* User: Administrator
* Time: 19:53
header(&Content-type:text/charset=utf-8&);
$hotSaleContent1 = array(
&imgURL& =& &./百姓商城-百姓广场网上商城-郑州建材_郑州家具_郑州建材网_郑州装修公司-价格最低,保障质量_files/bc4dab9be3e0a3.jpg&,
&title&=&&南方家居 Q23025床(带床垫)&,
&titleURL&=&&/item/52ac004bf9be3e0a3.htm&,
&Nprice& =& &1980&,
&Oprice&=&&1980&,
&number&=&&53&
$hotSaleContent2=array(
&imgURL&=&&./百姓商城-百姓广场网上商城-郑州建材_郑州家具_郑州建材网_郑州装修公司-价格最低,保障质量_files/bf8604dab9be3e0a3.jpg&,
&title&=&&富魄力 M-66型沙发&,
&titleURL&=&&/item/f06de39be3e0a3.htm&,
&Nprice&=&&3600&,
&Oprice&=&&8600&,
&number&=&&60&
$hotSaleContent3=array(
&imgURL&=&&./百姓商城-百姓广场网上商城-郑州建材_郑州家具_郑州建材网_郑州装修公司-价格最低,保障质量_files/804eec0921e04dab9be3e0a3.jpg&,
&title&=&&和木轩 HK8005电视柜&,
&titleURL&=&&/item/526a0fc0abe3e0a3.htm&,
&Nprice&=&&3600&,
&Oprice&=&&8600&,
&number&=&&60&
$hotSaleContent4=array(
&imgURL&=&&./百姓商城-百姓广场网上商城-郑州建材_郑州家具_郑州建材网_郑州装修公司-价格最低,保障质量_files/cbaeb104d589be3e0a3.jpg&,
&title&=&&怡品源12F07-12E07餐桌椅&,
&titleURL&=&&/item/52fec2ee0d0a18d89be3e0a3.htm&,
&Nprice&=&&300&,
&Oprice&=&&800&,
&number&=&&600&
$hotSaleContent5=array(
&imgURL&=&&./百姓商城-百姓广场网上商城-郑州建材_郑州家具_郑州建材网_郑州装修公司-价格最低,保障质量_files/cbaeb104d589be3e0a3.jpg&,
&title&=&&怡品源12F07-12E07餐桌椅&,
&titleURL&=&&/item/52fec2ee0d0a18d89be3e0a3.htm&,
&Nprice&=&&300&,
&Oprice&=&&800&,
&number&=&&600&
$hotSaleContent6=array(
&imgURL&=&&./百姓商城-百姓广场网上商城-郑州建材_郑州家具_郑州建材网_郑州装修公司-价格最低,保障质量_files/cbaeb104d589be3e0a3.jpg&,
&title&=&&怡品源12F07-12E07餐桌椅&,
&titleURL&=&&/item/52fec2ee0d0a18d89be3e0a3.htm&,
&Nprice&=&&300&,
&Oprice&=&&800&,
&number&=&&600&
$hotSaleContent7=array(
&imgURL&=&&./百姓商城-百姓广场网上商城-郑州建材_郑州家具_郑州建材网_郑州装修公司-价格最低,保障质量_files/804eec0921e04dab9be3e0a3.jpg&,
&title&=&&和木轩 HK8005电视柜&,
&titleURL&=&&/item/526a0fc0abe3e0a3.htm&,
&Nprice&=&&3600&,
&Oprice&=&&8600&,
&number&=&&60&
$hotSaleContent8=array(
&imgURL&=&&./百姓商城-百姓广场网上商城-郑州建材_郑州家具_郑州建材网_郑州装修公司-价格最低,保障质量_files/bf8604dab9be3e0a3.jpg&,
&title&=&&富魄力 M-66型沙发&,
&titleURL&=&&/item/f06de39be3e0a3.htm&,
&Nprice&=&&3600&,
&Oprice&=&&8600&,
&number&=&&60&
$hotSale=array($hotSaleContent1,
$hotSaleContent2,$hotSaleContent3,
$hotSaleContent4,$hotSaleContent5,
$hotSaleContent6,$hotSaleContent7,
$hotSaleContent8);
&p&这里面就是所有的服务器提供的数据
然后进行获取那个数组&/p&&p&&span style=&font-family: Arial, Helvetica, sans-&&$hotS&/p&&p&然后传到我们html的ajax的data里面即使这个:&/span&&/p&&span style=&font-family: Arial, Helvetica, sans-&&&/span&&pre name=&code& class=&html&&success:function(data){
var result=eval(&(&+data+&)&);
alert(data);
这个就是ajax获取成功的时候执行的函数funcation()里面的data就获取到了我们那个数组,其实他是json文件,只是像数组格式我们还要进行转换
&span style=&font-family: Arial, Helvetica, sans-&&&/span&&pre name=&code& class=&html&&var result=eval(&(&+data+&)&);这句话就是把他转换成真正我们熟悉的array数组;
然后就是我们要八条数据吗进行遍历
&pre name=&code& class=&html&&for(var i=0;i&result.i++){
var str = &&li class='hot_sale_li left' && +
&&div class='pic'&&a style='width:260height:172' href='& + result[i].titleURL + &' title='维多利陶瓷 自然石系列'&&img style='width:260height:172' alt='& + result[i].title + &' src='& + result[i].imgURL + &' /&&/a&&/div&& +
&&p class='tit'&&a href='& + result[i].titleURL + &' title='& + result[i].title + &'&& + result[i].title + &&/a&&/p&& +
&&div class='price'&&span class='right'&预订：&b class='yd_num'&& + result[i].number + &&/b&件&/span&&span class='bx_price'&￥& + result[i].Nprice + &&/span&&span class='store_price'&￥& + result[i].Oprice + &&/span&&/div& &/li&&
result.length就是我们的最大长度了,
最后遍历之后就会输出八条了;不过肯定有人问 你怎么把服务器传过来的数组加载到html中的;下面对上面的那个var str里面的内容讲解一下:
&pre name=&code& class=&html& style=&font-family: Arial, Helvetica, sans-&&var str = &&li class='hot_sale_li left' && +
&&div class='pic'&&a style='width:260height:172' href='& + result[i].titleURL + &' title='维多利陶瓷 自然石系列'&&img style='width:260height:172' alt='& + result[i].title + &' src='& + result[i].imgURL + &' /&&/a&&/div&& +
&&p class='tit'&&a href='& + result[i].titleURL + &' title='& + result[i].title + &'&& + result[i].title + &&/a&&/p&& +
&&div class='price'&&span class='right'&预订：&b class='yd_num'&& + result[i].number + &&/b&件&/span&&span class='bx_price'&￥& + result[i].Nprice + &&/span&&span class='store_price'&￥& + result[i].Oprice + &&/span&&/div& &/li&&
大家可以看到这是一个自定义的数组然后把每一行都加一个&++&连起来 大家都明白,这是js中的链接方式;里面的数据替换是用的是
result[i].XXX; i就是进行遍历的数据 每一个不同的i从服务器json里面获取不同的数据 因为转换成数组了 就可以用来获取了;
XXX就是指的是每一个数组键,来获取里面的值 放到属性里面,就把这个html写活了!!!
加载完显示就是和上一个界面一样的!!
可能我说的大家有的不懂, 希望大家提意见 或者又不懂的下面留言,我会尽力讲解的 !
&&相关文章推荐
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：60714次
排名：千里之外
原创：32篇
(2)(1)(5)(3)(19)(1)(3)
(window.slotbydup = window.slotbydup || []).push({
id: '4740881',
container: s,
size: '200,200',
display: 'inlay-fix'2017年1月 总版技术专家分月排行榜第三
2017年2月 PHP大版内专家分月排行榜第一2017年1月 PHP大版内专家分月排行榜第一
2013年5月 总版技术专家分月排行榜第一
2016年7月 总版技术专家分月排行榜第二2016年3月 总版技术专家分月排行榜第二2015年12月 总版技术专家分月排行榜第二2014年8月 总版技术专家分月排行榜第二2014年7月 总版技术专家分月排行榜第二2013年6月 总版技术专家分月排行榜第二
2014年11月 PHP大版内专家分月排行榜第三2014年6月 PHP大版内专家分月排行榜第三2014年4月 PHP大版内专家分月排行榜第三2014年2月 PHP大版内专家分月排行榜第三2013年11月 PHP大版内专家分月排行榜第三
2014年11月 PHP大版内专家分月排行榜第三2014年6月 PHP大版内专家分月排行榜第三2014年4月 PHP大版内专家分月排行榜第三2014年2月 PHP大版内专家分月排行榜第三2013年11月 PHP大版内专家分月排行榜第三
本帖子已过去太久远了，不再提供回复功能。关于前后台数据交互【php吧】_百度贴吧
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&签到排名：今日本吧第个签到，本吧因你更精彩，明天继续来努力！
本吧签到人数：0成为超级会员，使用一键签到本月漏签0次！成为超级会员，赠送8张补签卡连续签到：天&&累计签到：天超级会员单次开通12个月以上，赠送连续签到卡3张
关注：138,198贴子：
关于前后台数据交互收藏
php获取的数据库记录怎么才能传到前台啊，有没有什么简单的例子啊，比如查到了3条记录 张三，男，18
李四，男，17
王五，女，18，怎么传递到前台
php,中公「优就业」0基础入学,4个月实战学习,推荐就业,报名周末班还享8折优惠!php,中公「优就业」小班教学,免费食宿,赠网课,免费重修!
Smarty模板引擎。或者框架里面都有自带的输出到模板。
将从数据库获取的记录集赋值给数组，然输出数组就行了
登录百度帐号推荐应用php 和 js 进行前后台数据交互_php吧_百度贴吧
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&签到排名：今日本吧第个签到，本吧因你更精彩，明天继续来努力！
本吧签到人数：0成为超级会员，使用一键签到本月漏签0次！成为超级会员，赠送8张补签卡连续签到：天&&累计签到：天超级会员单次开通12个月以上，赠送连续签到卡3张
关注：138,198贴子：
php 和 js 进行前后台数据交互收藏
一般用什么jquery，json，还是什么，谁能给我举个例子，比如读取了用户表的3条记录，id，性别，年龄。怎么传递到前台
php,中公「优就业」0基础入学,4个月实战学习,推荐就业,报名周末班还享8折优惠!php,中公「优就业」小班教学,免费食宿,赠网课,免费重修!
给个教程的链接也行
json能存多长的数据
没人(⊙o⊙)…
我今年参加了达内的php ,毕业前500强企业来达内招聘,我顺利通过面试拿到了工作,现在工作很不错,朋友都很羡慕.
ajax就是实现前后端数据用的
登录百度帐号推荐应用