宝哥软件园

用PHP ajax实现两级链接菜单功能的例子

编辑:宝哥软件园 来源:互联网 时间:2021-08-30

本文以PHP ajax为例,实现了两级联动菜单功能。分享给大家参考,如下:

如何实现二次联动

操作原理

两级联动是开发中常见的技术点。它主要使用ajax,JS的本地刷新技术。与常规页面全局刷新不同,它只刷新我们需要更改值的地方。我们先来看看它的工作流程。

第一步:我们将向后台发送请求。第二步:后台接受请求后,会给我们返回一个值。第三步:用JS在页面的HTML代码中呈现值

htmlheadtitlewww.jb51.net/title元http-equiv=' content-type ' content=' text/html '的二级链接;charset=utf8 ' script src=' http :https://cdn . bootscs.com/jquery/3 . 2 . 1/jquery . min . js '/script style # area-box { width :500 px;高度:400 px;margin:0 autoborder:0px实心# dddddd文本对齐:居中;}.area-select { width :200 px;高度:30 px;margin-top :30 px;边距-left :30 px;}/style head bad div id=' area-box ' select class=' area-select ' id=' address ' Option value=' 0 '请选择一个省份/optionvalue=' 1 '四川/optionvalue=' 2 '河北option value=' 3 '湖南/Option/select select select select class=' area-select ' id=' city '选项请选择city/Option/select/div script $(function(){//初始化数据var url=' address.php//背景地址$ ('# address ')。change(function(){//听change事件var address=$(this)。下拉列表中的val();//获取从下拉列表中选择的值//发送一个$的发布请求。ajax ({type:' post ',url3360url,data: {key:address},datatype3360' JSON ',success:函数(数据){//请求回调函数varstatus=data成功。//获取返回值var address=data.data如果(状态==200){ //判断状态码,200成功;var选项=' ';for(var I=0;连衣裙长度;I ){ //循环获取返回值并组装成html代码option=' option ' address[I]'/option ';} } else { var option=' option select a city/option ';//默认值} $('#city ')。html(选项);//js刷新第二个下拉框的值。});});});/script/bodyPHP代码

?PHP $ key=$ _ POST[' key '];//获取值$address[1]=array('成都','绵阳','德阳');$address[2]=数组('石家庄','唐山','秦皇岛');$address[3]=数组('长沙','株洲','湘潭');if(!empty($ address[$ key]){//有值,assembly data $ result[' status ']=200;$ result[' data ']=$ address[$ key];}else{ //没有值,返回状态代码220 $ result[' status ']=220;} echo JSON _ encode($ result);//返回JSON数据?运行效果:

其实三级联动和二级联动的原理是一样的,只是在此基础上重复一次

更多对PHP相关内容感兴趣的读者可以查看本网站专题:《PHP+ajax技巧与应用小结》、《PHP网络编程技巧总结》、《PHP基本语法入门教程》、《php面向对象程序设计入门教程》、《php字符串(string)用法总结》、《php+mysql数据库操作入门教程》、《php常见数据库操作技巧汇总》、0103010

希望本文对PHP编程有所帮助。

更多资讯
游戏推荐
更多+