微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

几种二级联动案例jQuery\Array\Ajax php

在开发过程中,遇到过非常多的二级联动,下面是我总结出来的几种二级联动案例

二级联动(1)

第一种案例是一种比较简单的二级联动,利用jquery的显示隐藏来实现,对于数据较少的二级联动来说可以采纳

rush:xhtml;"> 二级联动

/引入jquery文件/
<script type="text/javascript" src="jquery-1.11.3.min.js">
<script type="text/javascript">
var currentShowCity=0;
$(document).ready(function(){
$("#province").change(function(){
$("#province option").each(function(i,o){
if($(this).attr("selected"))
{
$(".city").hide();
$(".city").eq(i).show();
currentShowCity=i;
}
});

});
$("#province").change();
});

function getSelectValue(){
alert("1级="+$("#province").val());
$(".city").each(function(i,o){
if(i == currentShowCity){
alert("2级="+$(".city").eq(i).val());
}

});

}

/*获取数据*/

<input type="button" value="点我" onclick="getSelectValue();">

二级联动(2)- Array

第二种案例是使用二维数组传数据,使用javascript

rush:xhtml;"> 二级联动 北京

<select id="city" style="width:60px">

二级联动(3)- Ajax

第三种案例是使用ajax

rush:xhtml;"> 二级联动

<select id="province">

<select id="city">

二级联动(3-1)- Ajax/PHP

第三种案例是使用ajax,从PHP获取数据

rush:xhtml;"> Ajax案例一

PHP:

rush:PHP;"> // 服务器端响应的是字符串

?>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

原文地址:https://www.jb51.cc/ajax/46614.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐