Ajax+PHP实现的分类列表框功能示例


Posted in PHP onFebruary 11, 2019

本文实例讲述了Ajax+PHP实现的分类列表框功能。分享给大家供大家参考,具体如下:

一 代码

conn.php:

<?php
  $conn = mysql_connect("localhost", "root", "root") or die("连接数据库服务器失败!".mysql_error()); //连接MySQL服务器
  mysql_select_db("db_database27",$conn); //选择数据库db_database27
  mysql_query("set names utf8"); //设置数据库编码格式utf8
?>

index.php:

<!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>添加商品信息</title>
</head>
<body>
<script language="javascript" src="index.js"></script>
<form name="form" method="post" action="">
 <table width="419" border="0" align="center" cellspacing="1" bgcolor="#9999CC">
  <tr>
   <td height="36" colspan="3" bgcolor="#FFFFFF"><font color="#0066CC" size="+2">添加商品</font></td>
  </tr>
  <tr>
   <td width="122" height="26" bgcolor="#FFFFFF" align="right">商品名称:</td>
   <td height="26" colspan="2" bgcolor="#FFFFFF"><input type="text" name="name" /></td>
  </tr>
  <tr>
   <td height="26" bgcolor="#FFFFFF" align="right">商品类别:</td>
   <td width="64" height="26" bgcolor="#FFFFFF"><select name="ptype" id="ptype" onchange="changetype(this.value)">
  <?php
   include_once("conn/conn.php");//包含数据库连接文件
 $sql=mysql_query("select * from tb_commotype group by ptype");//按大类分组查询
 while($row=mysql_fetch_array($sql)){//循环输出下拉列表框选项
  echo "<option value='".$row['ptype']."'>".$row['ptype']."</option>";
 }
 ?>
   </select></td>
   <td width="219" height="26" bgcolor="#FFFFFF" id="showtype" name="showtype"></td>
  </tr>
  <tr>
   <td height="26" bgcolor="#FFFFFF" align="right">商品价格:</td>
   <td height="26" colspan="2" bgcolor="#FFFFFF"><input type="text" name="price" /></td>
  </tr>
  <tr>
   <td height="26" bgcolor="#FFFFFF"> </td>
   <td height="26" colspan="2" bgcolor="#FFFFFF"><input type="submit" name="Submit" value="提交" /></td>
  </tr>
 </table>
</form>
<script language="javascript">
  changetype(document.getElementById("ptype").value);//页面载入即执行函数,显示子类内容
</script>
</body>
</html>

type.php:

<?php
  include_once("conn/conn.php");//包含数据库连接文件
 //echo $_GET['ptype'];
 //$ptype=iconv("gb2312","utf-8",$_GET['ptype']);//把参数值做编码转换
 $sql=mysql_query("select stype from tb_commotype where ptype='".$_GET['ptype']."'");//查询子类内容
 echo "<select name='stype' id='stype'>";//输出html
 while($row=mysql_fetch_array($sql)){//循环输出列表框选项中子类内容
  echo "<option value='".$row['stype']."'>".$row['stype']."</option>";
 }
 echo "</select>";//输出html
?>

index.js:

function changetype(v){
 var xml;
 if(window.ActiveXObject){//如果是浏览器支持ActiveXObjext则创建ActiveXObject对象
  xml=new ActiveXObject('Microsoft.XMLHTTP');
 }else if(window.XMLHttpRequest){//如果浏览器支持XMLHttpRequest对象则创建XMLHttpRequest对象
  xml=new XMLHttpRequest();
 }
  xml.open("GET","type.php?ptype="+v,true);//使用GET方法调用type.php并传递参数的值
  xml.onreadystatechange=function(){//当服务器准备就绪执行回调函数
   if(xml.readyState==4 && xml.status==200){//如果服务器已经传回信息并未发生错误
    var msg=xml.responseText;//把服务器传回的值赋给变量msg
 //document.getElementById("showtype").innerHTML=msg;
 alert(msg);
   showtype.innerHTML=msg;//把传回的值显示在id=showtype的元素中
   }
  }
  xml.send(null);//不发送任何数据,因为数据已经使用请求URL通过GET方法发送
}

二 运行结果

Ajax+PHP实现的分类列表框功能示例

希望本文所述对大家PHP程序设计有所帮助。

PHP 相关文章推荐
用PHP进行MySQL删除记录操作代码
Jun 07 PHP
php $_SERVER当前完整url的写法
Nov 12 PHP
PHP入门学习笔记之一
Oct 12 PHP
ubuntu10.04配置 nginx+php-fpm模式的详解
Jun 03 PHP
一组PHP加密解密函数分享
Jun 05 PHP
CodeIgniter安全相关设置汇总
Jul 03 PHP
PHP中shuffle数组值随便排序函数用法
Nov 21 PHP
分享下php5类中三种数据类型的区别
Jan 26 PHP
php基于GD库画五星红旗的方法
Feb 24 PHP
详解WordPress中添加友情链接的方法
May 21 PHP
PHP面向对象程序设计之多态性的应用示例
Dec 19 PHP
PHP检查URL包含特定字符串实例方法
Feb 11 PHP
Ajax+PHP实现的模拟进度条功能示例
Feb 11 #PHP
Ajax+Jpgraph实现的动态折线图功能示例
Feb 11 #PHP
php防止表单重复提交实例讲解
Feb 11 #PHP
stripos函数知识点实例分享
Feb 11 #PHP
PHP检查URL包含特定字符串实例方法
Feb 11 #PHP
PHP strripos函数用法总结
Feb 11 #PHP
PHP xpath()函数讲解
Feb 11 #PHP
You might like
php开发工具之vs2005图解
2008/01/12 PHP
php 获取本机外网/公网IP的代码
2010/05/09 PHP
php中关于长度计算容易混淆的问题分析
2016/05/27 PHP
总结对比php中的多种序列化
2016/08/28 PHP
PHP echo()函数讲解
2019/02/15 PHP
php curl简单采集图片生成base64编码(并附curl函数参数说明)
2019/02/15 PHP
JS实现图片无间断滚动代码汇总
2014/07/30 Javascript
浅谈Sizzle的“编译原理”
2015/04/14 Javascript
jQuery仿天猫实现超炫的加入购物车
2015/05/04 Javascript
浅谈js 闭包引起的内存泄露问题
2015/06/22 Javascript
jQuery实现带有动画效果的回到顶部和底部代码
2015/11/04 Javascript
JavaScript基于对象去除数组重复项的方法
2016/10/09 Javascript
基于react框架使用的一些细节要点的思考
2017/05/31 Javascript
vue2.0+vuex+localStorage代办事项应用实现详解
2018/05/31 Javascript
vue自定义键盘信息、监听数据变化的方法示例【基于vm.$watch】
2019/03/16 Javascript
Vue使用watch监听一个对象中的属性的实现方法
2019/05/10 Javascript
LayUI switch 开关监听 获取属性值、更改状态的方法
2019/09/21 Javascript
VUE UPLOAD 通过ACTION返回上传结果操作
2020/09/07 Javascript
Python自动生产表情包
2017/03/17 Python
python爬虫实战之最简单的网页爬虫教程
2017/08/13 Python
python利用urllib实现爬取京东网站商品图片的爬虫实例
2017/08/24 Python
Python基于pandas实现json格式转换成dataframe的方法
2018/06/22 Python
python之列表推导式的用法
2019/11/29 Python
使用jupyter notebook将文件保存为Markdown,HTML等文件格式
2020/04/14 Python
澳大利亚正品化妆品之家:Cosmetic Capital
2017/07/03 全球购物
Bibloo奥地利:购买女装、男装、童装、鞋和配件
2018/10/18 全球购物
Shopee越南:东南亚与台湾电商平台
2019/02/03 全球购物
阿联酋手表和配饰购物网站:Rivolishop
2019/11/25 全球购物
高中英语教学反思
2014/02/04 职场文书
项目采购员岗位职责
2014/04/15 职场文书
普通党员四风问题对照检查材料
2014/09/27 职场文书
小学优秀教师先进事迹材料
2014/12/16 职场文书
学术研讨会主持词
2015/07/04 职场文书
教育教学工作反思
2016/02/24 职场文书
python随机打印成绩排名表
2021/06/23 Python
Redis做数据持久化的解决方案及底层原理
2021/07/15 Redis