日期时间选择

<div style="width:600px; height:100px;">

<select id="year">

</select>

<select id="month" onchange="FillDay()">

</select>

<select id="day">

</select>

</div>

</body>

<script type="text/javascript">

FillYear();

FillMonth();

FillDay();

function FillYear()

{

var sj = new Date();

var nian = sj.getFullYear();

var s = "";

for(var i=nian-5;i<nian+6;i++)

{

if(i==nian)

{

s +="<option selected=‘selected‘>"+i+"</option>";

}

else

{

s +="<option>"+i+"</option>";

}

}

document.getElementById("year").innerHTML = s;

}

function FillMonth()

{

var sj = new Date();

var yue = sj.getMonth()+1;

var s = "";

for(var i=1;i<13;i++)

{

if(i==yue)

{

s +="<option selected=‘selected‘>"+i+"</option>";

}

else

{

s +="<option>"+i+"</option>";

}

}

document.getElementById("month").innerHTML=s;

}

function FillDay()

{

var sj = new Date();

var tian = sj.getDate();

//取月份求天数

var yue = document.getElementById("month").value;

var n = 31;

if(yue==4 || yue==6 ||yue==9 ||yue==11)

{

n = 30;

}

else if(yue==2)

{

n=28;

}

//用循环添加

var s = "";

for(var i=1;i<n+1;i++)

{

if(i==tian)

{

s +="<option selected=‘selected‘>"+i+"</option>";

}

else

{

s +="<option>"+i+"</option>";

}

}

document.getElementById("day").innerHTML = s;

}

function Dan()

{

//把列表1选中值取出

var list1 = document.getElementById("list1");

var v = list1.value;

//造一个option项

var s = "<option class=‘o2‘>"+v+"</option>";

//判断list2里面是否有该项

var attr = document.getElementsByClassName("o2");

var cz = true;

for(var i=0;i<attr.length;i++)

{

//alert(attr[i].innerHTML);

if(attr[i].innerHTML==v)

{

cz = false;

break;

}

}

if(cz)

{

//将option项扔到list2

var list2 = document.getElementById("list2");

list2.innerHTML +=s;

}

}

function Duo()

{

document.getElementById("list2").innerHTML = document.getElementById("list1").innerHTML;

}

</script>

</html>

时间: 2024-11-05 03:29:16

日期时间选择的相关文章

[转]ASP.NET MVC HtmlHelper扩展之Calendar日期时间选择

本文转自:http://blog.bossma.cn/asp_net_mvc/asp-net-mvc-htmlhelper-calendar-datetime-select/ 这里我们扩展HtmlHelper,就像它包含在ASP.NET MVC中一样,扩展方法使我们能为已有的类添加方法.这里使用了一个日期时间选择控件:My97DatePicker,需要添加到网站中,并在页面中引用. 先看看是怎么扩展的: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18

Jquery mobiscroll 移动设备(手机)wap日期时间选择插件以及滑动、滚动插件

Jquery mobiscroll 移动设备(手机)wap日期时间选择插件以及滑动.滚动插件 : http://www.cnblogs.com/linJie1930906722/p/6072984.htm

bootstrap-datetimepicker:基于twitter bootstrap的日期/时间选择控件

bootstrap-datetimepicker是一个基于twitter bootstrap的简单日期/时间选择控件. <!DOCTYPE HTML> <html> <head> <link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css" rel="stylesheet"> <

C# 自定义控件,日期时间选择输入插件

using System;using System.ComponentModel;using System.Drawing;using System.Reflection;using System.Windows.Forms;namespace pictureAnalyse{ /// <summary> /// 此类用于实现一个日期时间辅助输入插件,调用逻辑: /// new DateTimeChoser(textBox1); //即可为textBox1绑定一个日期时间输入控件 /// <

Extjs DateTime 日期时间选择控件 (非点击日期强制选择) 支持4.0以上

Extjs的日期控件,仅仅能支持到日期选择,对时间的选择并不完好.而网上下载的控件,都是基于Ext.form.dateField 开发.在选中日期后自己主动选择,并隐藏此选择窗体. 在经过一番改造后,最终做好了一个带确认button的时间选择控件.截图例如以下 详细代码在附件里.  要想正常使用,还须要加一段css样式: .x-datepicker-sel { border-color: rgb(224, 162, 162); border-style: solid; border-width:

关于使用jqmobi前端框架在phonegap平台上开发时的日期时间选择控件

jqmobi(appframework)作为Intel的一款html5移动前端框架,以其自身轻量级和容易上手获得了很多移动HTML5开发者的喜爱,相对于jquerymobile,它可以说将jQuerymobile进行了重写,针对移动端做了很好的优化,(jQuerymobile太过于臃肿,实际在真机上效果较差),但是经过使用,发现jqmobi也有一些缺点,比如说bug较多,UI控件较少,插件较少,不能够满足大型应用开发需求.最不可接受的是它竟然没有提供日期和时间选择插件(日期时间选择功能很常用).

Android笔记——date&amp;time(日期时间选择对话框)

TimePickerDialog(时间选择对话框) 创建TimePickerDialog时间选择对话框: 1.创建一个类继承DialogFragement 2.重写onCreateDialog()方法,返回一个TimePickerDialog对象 3.实现TimePickerDialog的OnTimeSetListener接口来接收一个回调,当用户设置时间 DatePickerDialog(日期选择对话框) 创建DatePickerDialog日期选择对话框: 1.创建一个类继承DialogFr

material风格的日期/时间选择:SublimePicker

介绍: 一个material风格的view,提供了各种关于日期选择的功能,可以选择日期,选择时间,选择重复次数等,可以在不离开选择器的情况下在不同的选择界面间切换.其实这些功能是从5.0的日历中抠出来的,我觉得代码也是. 运行效果: 使用说明: 启动DatePicker 左下角的日期按钮可以切换到TimePicker   右上角的溢出菜单可以打开RecurrencePicker: 选择自定义菜单,则会显示RecurrenceOptionCreator: 选择底部spinner里面的直到某个日期选

猎豹MFC--DataTimePicker日期时间选择控件CDatatimeCtrl CTime CTimeSpan时间间隔

设置长日期格式: 结束日期一样添加变量: 其他两个一样添加变量. 双击开始日期添加消息处理: 日期时间发生了改变: 添加日期改变消息处理函数: 一样给结束日期添加日期改变消息处理: 因为结束日期日期改变 处理程序和开始日期的一样,所以封装为函数 ,,进行调用可避免写两次: 在封装好的函数内进行 日期减法计算 ,计算两个日期间隔多少天: +1后 包含当天 修改时间控件的ID 给时间添加 时间改变消息处理函数: 一样把时间的  时间改变处理  封装成函数进行调用: 下面,分别在两个时间改变消息处理中

基于zepto的移动端日期+时间选择插件

前段时间写了两个移动端的日期选择插件:轻量级移动端日期选择器,本来是为特定的场景中使用的,结果有同学反应不够灵活和强大.虽然我的看法是移动端的界面要尽可能简洁,功能要尽可能简单,但是难免还是会有各种各样的场景,有时候确实需要同时选择年.月.日.时.分.秒,日期的格式要能配置,要能显示“上午 下午”......诸如此类. 所以,一下狠心,索性写个全的吧,之前写的是mdater和mtimer俩兄弟,再来个合体的mdatetimer,意为可以同时选择日期和时间,当然你要只选择日期也是可以配置的.操作方