`
JavaSam
  • 浏览: 933010 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

JS时间下拉列表-------只显示年份

 
阅读更多
var Calendar = {};
Calendar.$ = function (id){
	return document.getElementById(id);//id选择器
}
/**
 * 初始化方法
 * @param context
 * @param startYear
 * @param floatYear
 */
Calendar.init = function (startYear,floatYear,context){
	try {
		this.constructor = Calendar.init;
		this.context = this.defaultContext;//默认执行上下文
		this.context = context ?  context.nodeType === 1 ? context : this.$(context):context||this.$("calendarSelect");//选择要渲染的空间
		this.context.style.width = "100px";//默认长度
		this.startYear = startYear||new Date().getFullYear();//开始的年份,默认当前年
		this.floatYear = floatYear || 10;//浮动多少年
		this.createOption = createOption(this.startYear,this.floatYear);//创建option
	} catch (e) {
		alert(e);
	}
	return this;
}
/**
 * 创建option
 * @param startYear
 */
function createOption(startYear,floatYear){
	var fragment = document.createDocumentFragment();
	fragment = tempCreateOption(fragment,floatYear,true);
	var currenYearOption = document.createElement("option");
	currenYearOption.selected = 'selected';//设置当前年为选中
	currenYearOption.appendChild(document.createTextNode(startYear))
	fragment.appendChild(currenYearOption);
	fragment = tempCreateOption(fragment,floatYear,false);
	Calendar.context.appendChild(fragment);
	return this;
}


function tempCreateOption(fragment,floatYear,flag){
	for(var i = flag?floatYear:1 ;flag?i>=1:i < floatYear ; flag?i--:i ++){
		var option = document.createElement("option");
		var tmp = flag ? this.startYear+ i : this.startYear-i;
		var text = document.createTextNode(Calendar.startYear + (flag?i:-i));	
		option.appendChild(text);
		fragment.appendChild(option);
	}
	return fragment;
}

 

0
2
分享到:
评论

相关推荐

    js实现起始年份下拉列表

    本实例实现起始年份下拉列表功能: 1、当你没有选择开始年份时,结束年份的下拉框不会出数据; 2、当选择了开始年份时,结束年份下拉列表展示出来的数据小于等于开始年份;3、数据是动态的;

    设置年份javaScript下拉列表框内容

    javascript下拉列表框,内容为当前年份及前后50年,默认选择为当前年份

    js级联下拉列表(日历控件)

    帮朋友写的:下拉式列表日期控件,只有年份是写死的,月份和日都是在加载时js动态添加的。同时也根据月份的不同修改天数(包括闰年平年二月的天数);点击按钮后在文本域里显示了js调用后台函数的方法(这个是查到的...

    javaScript年份下拉列表框内容为当前年份及前后50年

    javascript下拉列表框,内容为当前年份及前后50年,默认选择为当前年份 代码如下: [removed] [removed]=function(){ //设置年份的选择 var myDate= new Date(); var startYear=myDate.getFullYear()-50;//起始年份 ...

    vue时间插件 中datepicker.js 修改过支持年,年月,年月日的选择

    vue时间插件 中datepicker.js 修改过支持年,年月,年月日的选择

    JavaScript网页特效范例宝典源码

    4.1 日期时间显示 174 实例109 在标题栏中显示日期时间 174 实例110 使用toLocaleString()方法获取本地时间 176 实例111 全中文显示日期 176 实例112 在状态栏中显示日期时间 178 实例113 使用数组显示星期 179 实例...

    程序天下:JavaScript实例自学手册

    6.5 从一个下拉列表往另一个下拉列表添加内容 6.6 改变列表项的上下顺序 6.7 给下拉框数据分组 6.8 获取列表框的选择 6.9 类IE下拉框 6.10 下拉框式邮件发送 6.11 获取多选框的选择项 6.12 手动调整的列表框 6.13 ...

    jQuery实现动态生成年月日级联下拉列表示例

    本文实例讲述了jQuery实现动态生成年月日级联下拉列表。分享给大家供大家参考,具体如下: html代码: &lt;form name="form1" id="dateForm"&gt; &lt;select name="year"&gt;&lt;/select&gt;年 &lt;select name=...

    javascript函数的解释

    34.下拉列表框的值:document.forms[0].selectName.options[n].value (n有时用下拉列表框名称加上.selectedIndex来确定被选中的值) 35.字符串的定义:var myString = new String("This is lightsword"); 36.字符串转成...

    《程序天下:JavaScript实例自学手册》光盘源码

    6.5 从一个下拉列表往另一个下拉列表添加内容 6.6 改变列表项的上下顺序 6.7 给下拉框数据分组 6.8 获取列表框的选择 6.9 类IE下拉框 6.10 下拉框式邮件发送 6.11 获取多选框的选择项 6.12 手动调整的列表框 6.13 ...

    基于pj.js实现的日历选择控件,文本框日期选择.rar

    date:默认开始日期,不需要可以是null(以当天日期开始),yearListLength:年份下拉列表长度,当改变年份或者月份是的事件监听器,以当前Calendar对象为上下文执行fn函数,当选择日期时触发的函数,以当前Calendar对象为...

    107个常用javascript语句

    34.下拉列表框的值:document.forms[0].selectName.options[n].value (n有时用下拉列表框名称加上.selectedIndex来確定被选中的值) 35.字符串的定义:var myString = new String("This is lightsword"); 36.字符串转成...

    kursutveckling-web:一个用于处理页面生成的应用程序,该页面包含“课程和计划”目录中有关课程发展和历史的信息。 该页面包含i.a. 历史课程计划和pm版本的存档页面,以及包含特定课程的课程数据的已发布课程分析页面

    显示: 与课程信息相关页面的导航链接不多( kursinfo-web,kursinfo-admin-web ) 下拉列表以及所有以前的课程提纲包含课程数据和课程分析的表格,以及本课程的课程提纲(和课程下午) 每个表的导航链接以在管理...

    semantic-datepicker

    它使用日期选择器创建下拉列表,您可以在一个间隔之间选择一个日期。 也可以选择一个日期范围。 用法 依赖关系 该组件依赖于 、 和 。 &lt;link rel="stylesheet" type="text/css" href="./css/semantic/semantic...

    基于PJ库实现的JS日历

     date:默认开始日期,不需要可以是null(以当天日期开始),yearListLength:年份下拉列表长度,当改变年份或者月份是的事件监听器,以当前Calendar对象为上下文执行fn函数,当选择日期时触发的函数,以当前Calendar对象...

    nba-visualization:项目二

    我们将要创建的插图将显示在仪表板上,其中包括一个交互式的下拉列表,用于在特定面板上显示球队和球员统计信息,该面板将提供球员和赛季得分的总分。 我们将首先制作一个互动的条形图(球员,年份,球队),绘制每...

    Project-1-Dise-o-Web:项目

    下拉列表现在作为其父级的子级创建 可折叠支持嵌套 模态底页已添加 添加了不确定的复选框 添加了新的复选框样式 文本输入支持占位符/只读 添加了类似于Google Inbox的可折叠式 添加了文字字符计数器 波浪不再在SVG...

    如何在ASP中选择日期

     2、用下拉列表列出年份、月份、天数由用户选择输入。这种方法更麻烦,用户操作看似比上一种方便了,可是每一个日期输入都需要程序员在后台对年份、月份、天数一一循环列出,而且在列出前或用户输入后还是要对日期...

Global site tag (gtag.js) - Google Analytics