在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='"+i+"'>"+i+"</option>";
}
else
{
str = str +"<option value='"+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='"+i+"'>"+i+"</option>";
}
else
{
str = str+"<option value='"+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='"+i+"'>"+i+"</option>";
}
else
{
str = str +"<option value='"+i+"'>"+i+"</option>";
}
}
$("#tian").html(str);
}
在JavaScript文件中用jQuery方法实现日期时间选择功能的更多相关文章
- 在JavaScript文件中用ajax方法实现省市区的三级联动
1.JavaScript Document $(document).ready(function(e) { 加载三个下拉列表 $("#sanji").html("< ...
- C#中用DateTime的ParseExact方法解析日期时间(excel中使用系统默认的日期格式)
最近做的项目中服务器是英文的系统,系统需要通过excel的单元格导入日期,excel中的日期格式是系统默认的日期格式,如下图所示 以上日期格式,会跟着操作系统设置的日期格式相同例如我的中文系统的日期格 ...
- DateTime.ToString格式化日期,使用DateDiff方法获取日期时间的间隔数
一:DateTime.ToString格式化日期 二:代码 using System; using System.Collections.Generic; using System.Component ...
- 使用DateDiff方法获取日期时间的间隔数
一:用DateDiff方法获取日期时间的间隔数,截图 二:代码 using System; using System.Windows.Forms; using Microsoft.VisualBasi ...
- jquery仿ios日期时间插件
Demo下载: 手机时间控件.zip 使用之前,请在页面中加入以下js和css: jquery-1.9.1.js mobiscroll.core-2.5.2.js mobiscroll.core-2. ...
- C# winForm中调用javascript文件中的方法
目前有很多的SNS社区或类SNS的网站,例如开心.51.校内等,但是发现大多数社区在邀请好友的时候都没有提供对QQ邮箱或者QQ空间好友列表获取的功能,不过似乎海内支持,但是网上相关QQ的文章还不是很多 ...
- 记录:工作中用到的Js日期时间方法
/** * 获取当前时间 */ function getDate() { return new Date(); } /** * 格式化当前时间 * @param {*} value */ functi ...
- jquery 时间戳和日期时间转化
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 3 ...
- 扩展Date的format方法--格式化日期时间
Date.prototype.format = function (format) { var o = { "M+": this.getMonth() + 1, "d+& ...
随机推荐
- 01-01java概述 doc命令、jdk\jre下载安装、path、classpath配置、开发中常见小问题
1:计算机概述(了解) (1)计算机 (2)计算机硬件 (3)计算机软件 系统软件:window,linux,mac 应用软件:qq,yy,飞秋 (4)软件开发(理解) 软件:是由数据和指令组成的.( ...
- ubuntu升级pip后, ImportError: cannot import name ‘main‘
场景描述: 原先pip安装完成之后,一直没有更新版本,原pip版本为8.1.1,今天安装python 包pysftp的时候,提示需要升级pip到(pip 10.0.1); 于是乎,直接手到擒来,终端命 ...
- Python:高效计算大文件中的最长行的长度
在操作某个很多进程都要频繁用到的大文件的时候,应该尽早释放文件资源(f.close()) 前2种方法主要用到了列表解析,性能稍差,而最后一种使用的时候生成器表达式,相比列表解析,更省内存 列表解析和生 ...
- linux解压zip乱码解决方案
1.向系统添加windows下的字符编码: sudo vim /var/lib/locales/supported.d/local 添加一下编码: zh_CN.GBK GBK zh_CN.GB231 ...
- JavaScript -- Window-Move,Print
-----035-Window-Move.html----- <!DOCTYPE html> <html> <head> <meta http-equiv=& ...
- Element ui tree树形控件获取当前节点id和父节点id
低版本Element ui tree树形控件获取当前节点id和父节点id的方法:点击查看 最新版本Element ui tree树形控件获取当前节点id和父节点id教程: 1.找到node_modul ...
- Go http handler 中间件
在http的handler处理中加上中间件,可以进行过滤.记录日志.统计和统一返回结果 package main import ( "fmt" "net/http&quo ...
- spring boot 与 thymeleaf (2): 常用表达式
在asp.net mvc 中, 有一个视图解析器, 可以支持Razor语法. 使用起来, 是非常的方便, 并且, 写在前台页面的后台方法, 是可调试的. 但是在java中, 目前我还没有接触到, 像. ...
- Andrew Ng机器学习课程笔记(一)之线性回归
Andrew Ng机器学习课程笔记(一)之线性回归 版权声明:本文为博主原创文章,转载请指明转载地址 http://www.cnblogs.com/fydeblog/p/7364598.html 前言 ...
- MQ5.3在redhat9上的安装
一.准备工作 1.安装linux软件包 确保系统中有libgcc_s.so和libstdc++.so.3. 如无意外,libgcc_s.so在redhat中已经存在,存放路径为:/usr/lib/gc ...