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

前端之家收集整理的这篇文章主要介绍了几种二级联动案例(jQuery\Array\Ajax php)前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

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

二级联动(1)

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

二级联动

/引入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

二级联动 北京

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

二级联动(3)- Ajax

第三种案例是使用ajax

二级联动

<select id="province">

<select id="city">

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

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

Ajax案例一

PHP:

PHP;"> @H_829_301@

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

原文链接:https://www.f2er.com/ajax/46614.html

猜你在找的Ajax相关文章