首页 > 代码库 > 在JavaScript文件中用jQuery方法实现日期时间选择功能
在JavaScript文件中用jQuery方法实现日期时间选择功能
JavaScript Document
$(document).ready(function(e) {
在文本框里面显示当前日期
var date = new Date();
var nian = date.getFullYear();
var yue = date.getMonth()+1;
var tian = date.getDate();
$("#rq").val(nian+"-"+yue+"-"+tian);
给文本框加点击事件
$("#rq").click(function(){
$(‘#myModal‘).modal(‘show‘);
加载年
LoadNian();
加载月
LoadYue();
加载天
LoadTian();
})
当年份选中变化的时候,重新加载天
$("#nian").change(function(){
LoadTian();
})
当月份选中变化的时候,重新加载天
$("#yue").change(function(){
LoadTian();
})
给确定按钮加点击事件
$("#qd").click(function(){
var nian = $("#nian").val();
var yue = $("#yue").val();
var tian = $("#tian").val();
$("#rq").val(nian+"-"+yue+"-"+tian);
$(‘#myModal‘).modal(‘hide‘);
})
});
加载年的方法
function LoadNian()
{
var date = new Date();
var nian = date.getFullYear();
var str = "";
for(var i=nian-5;i<nian+6;i++)
{
if(i==nian)
{
str = str +"<option selected=‘selected‘ value=http://www.mamicode.com/‘"+i+"‘>"+i+"</option>";
}
else
{
str = str +"<option value=http://www.mamicode.com/‘"+i+"‘>"+i+"</option>";
}
}
$("#nian").html(str);
}
加载月
function LoadYue()
{
var date = new Date();
var yue = date.getMonth()+1;
var str = "";
for(var i=1;i<13;i++)
{
if(i==yue)
{
str = str+"<option selected=‘selected‘ value=http://www.mamicode.com/‘"+i+"‘>"+i+"</option>";
}
else
{
str = str+"<option value=http://www.mamicode.com/‘"+i+"‘>"+i+"</option>";
}
}
$("#yue").html(str);
}
加载天
function LoadTian()
{
var date = new Date();
var tian = date.getDate();
var yue = $("#yue").val();
var nian = $("#nian").val();
var zs = 31;
if(yue==4 || yue==6 || yue==9 || yue==11)
{
zs = 30;
}
else if(yue==2)
{
if((nian%4==0 && nian%100!=0) || nian%400==0 )
{
zs = 29;
}
else
{
zs = 28;
}
}
var str = "";
for(var i=1;i<zs+1;i++)
{
if(i==tian)
{
str = str +"<option selected=‘selected‘ value=http://www.mamicode.com/‘"+i+"‘>"+i+"</option>";
}
else
{
str = str +"<option value=http://www.mamicode.com/‘"+i+"‘>"+i+"</option>";
}
}
$("#tian").html(str);
}
在JavaScript文件中用jQuery方法实现日期时间选择功能