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 八种基本的数据类型小结
Jun 01 PHP
基于Zookeeper的使用详解
May 02 PHP
php读取excel文件的简单实例
Aug 26 PHP
PHP 字符串长度判断效率更高的方法
Mar 02 PHP
PHP图片处理之图片背景、画布操作
Nov 19 PHP
Laravel 中获取上一篇和下一篇数据
Jul 27 PHP
简单了解将WordPress中的工具栏移到底部的小技巧
Dec 31 PHP
php通过执行CutyCapt命令实现网页截图的方法
Sep 30 PHP
php中static 静态变量和普通变量的区别
Dec 01 PHP
ThinkPHP实现的rsa非对称加密类示例
May 29 PHP
PHP使用pdo连接access数据库并循环显示数据操作示例
Jun 05 PHP
php如何把表单内容提交到数据库
Jul 08 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网页游戏学习之Xnova(ogame)源码解读(六)
2014/06/23 PHP
PHP实现将浏览历史页面网址保存到cookie的方法
2015/01/26 PHP
学习php设计模式 php实现观察者模式(Observer)
2015/12/09 PHP
php实现常见图片格式的水印和缩略图制作(面向对象)
2016/06/15 PHP
Laravel如何友好的修改.env配置文件详解
2017/06/07 PHP
JS TextArea字符串长度限制代码集合
2012/10/31 Javascript
jquery offset函数应用实例
2012/11/14 Javascript
简介JavaScript中的setHours()方法的使用
2015/06/11 Javascript
JavaScript知识点整理
2015/12/09 Javascript
JS转换HTML转义符的方法
2016/08/24 Javascript
jQuery实现的表格展开伸缩效果实例
2016/09/07 Javascript
JS制作图形验证码实现代码
2020/10/19 Javascript
基于jQuery ligerUI实现分页样式
2016/09/18 Javascript
利用React-router+Webpack快速构建react程序
2016/10/27 Javascript
javascript动画系列之模拟滚动条
2016/12/13 Javascript
angularjs ocLazyLoad分步加载js文件实例
2017/01/17 Javascript
Vue Ajax跨域请求实例详解
2017/06/20 Javascript
浅谈Angular文字折叠展开组件的原理分析
2017/11/24 Javascript
Vue filter介绍及详细使用
2018/04/04 Javascript
微信小程序非swiper组件实现的自定义伪3D轮播图效果示例
2018/12/11 Javascript
BootstrapValidator实现表单验证功能
2019/11/08 Javascript
Python判断文件和文件夹是否存在的方法
2015/05/21 Python
Python二叉搜索树与双向链表转换实现方法
2016/04/29 Python
使用Python脚本和ADB命令实现卸载App
2017/02/10 Python
使用python实现个性化词云的方法
2017/06/16 Python
Python 实现使用dict 创建二维数据、DataFrame
2018/04/13 Python
浅谈python opencv对图像颜色通道进行加减操作溢出
2020/06/03 Python
Notino瑞典:购买香水和美容产品
2019/07/26 全球购物
Groupon法国官方网站:特卖和网上购物高达-70%
2019/09/02 全球购物
酒店拾金不昧表扬信
2014/01/18 职场文书
民族学专业求职信
2014/07/28 职场文书
合法的离婚协议书范本
2014/10/23 职场文书
优秀高中学生评语
2014/12/30 职场文书
企业开业庆典答谢词
2015/01/20 职场文书
环保建议书作文400字
2015/09/14 职场文书
SQL模糊查询报:ORA-00909:参数个数无效问题的解决
2021/06/21 Oracle