js做日期选择:
实现当前年份的前5后5年的日期选择 实现功能:年份和月份页面加载完成使用JS循环添加,天数根据月份的变化动态添加改变 扩展功能:天数可以根据闰年平年变化 <body> <select id="nian" onclick="biantian()"></select>年 <select id="yue" onclick="biantian()"></select>月 <select id="tian"></select>日 <script type="text/javascript"> FillNian(); FillYue(); FillTian(); function FillNian() { var b = new Date(); //获取当前时间 var nian = parseInt(b.getFullYear()); //把年份强制转换为整型 var str = ""; for(var i=nian-5;i<nian+6;i++) { str = str+"<option value='"+i+"'>"+i+"</option>";//添加<option>标签 } document.getElementById("nian").innerHTML = str; } function FillYue() { var str = ""; for(var i=1;i<13;i++) { str = str+"<option value='"+i+"'>"+i+"</option>"; } document.getElementById("yue").innerHTML = str; } function FillTian() { var yue = document.getElementById("yue").value; var nian = document.getElementById("nian").value; var ts = 31; if(yue==4 || yue==6 || yue==9 || yue==11) //判断月份 { ts=30; } if(yue==2) //如果是2月的话,里面要判断是不是闰年 { if((nian%4==0 && nian%100 != 0) || nian%400==0) { ts = 29; } else { ts = 28; } } var str = ""; for(var i=1;i<ts+1;i++) { str = str+"<option value='"+i+"'>"+i+"</option>"; } document.getElementById("tian").innerHTML = str; } function biantian() { FillTian(); } </script> </body>
ajax做三级联动:
当dataType:"text"时,返回的数据是这样的,所以下面的split根据“|”和“^”来分割
1.主页面做一个div,存储三个下拉列表,并引入jquery和js
<script src="jquery-1.11.2.min.js"></script> <script src="sanjiliandong.js"></script> </head> <body> <div id="sanji"></div> </body>
2.做一个纯js页面
// JavaScript Document $(document).ready(function(e) { //往页面id=sanji的div里面放三个下拉列表 var str="<select id='sheng'></select><select id='shi'></select><select id='qu'></select>"; $("#sanji").html(str); fillsheng(); //页面加载完,自动执行三个方法 fillshi(); fillqu(); $("#sheng").change(function(){ //当id=sheng的div改变时,触发市和区的方法 fillshi(); fillqu(); }); $("#shi").change(function(){ //当id=shi的div改变时,触发区的方法 fillqu(); }); //造一个填充省的方法 function fillsheng() { pcode="0001"; //数据库中省份的parentareacode都是0001 $.ajax({ async:false, //因为要同时执行下边函数,所以这里要设置为同步。 url:"sanjichuli.php", data:{pcode:pcode}, type:"POST", dataType:"text", success:function(data){ var hang=data.split("|"); //hang是二维数组 var str=""; for(var i=0;i<hang.length;i++) { var lie=hang[i].split("^"); str=str+"<option value='"+lie[0]+"'>"+lie[1]+"</option>"; } $("#sheng").html(str); } }); } //添加一个市的方法 function fillshi() { pcode=$("#sheng").val(); //代号取上一级的value值 $.ajax({ async:false, //为了下边的区能执行,这里要设置为同步 url:"sanjichuli.php", data:{pcode:pcode}, type:"POST", dataType:"text", success: function(data) { var hang=data.split("|"); var str=""; for(var i=0;i<hang.length;i++) { var lie=hang[i].split("^"); str=str+"<option value='"+lie[0]+"'>"+lie[1]+"</option>"; } $("#shi").html(str); } }); } //添加一个区方法 function fillqu() { pcode=$("#shi").val(); $.ajax({ url:"sanjichuli.php", data:{pcode:pcode}, type:"POST", dataType:"text", success:function(data) { var hang=data.split("|"); var str=""; for(var i=0;i<hang.length;i++) { var lie=hang[i].split("^"); str=str+"<option value='"+lie[0]+"'>"+lie[1]+"</option>"; } $("#qu").html(str); } }); } });
3.做一个处理页面
<?php $pcode=$_POST['pcode']; include("DBDA.class.php"); $db=new DBDA(); $sql="select * from chinastates where parentareacode='{$pcode}'"; echo $db->StrQuery($sql);