PC端如何用js做点击日历选中一周 -交通百科网

JS中写日历时候遇见的问题

网上这些很多，自己去找一个，对比吧

js日历（从……到……第二个框禁止点击第一个框选择的日期之前的日期）

用JQ的插件吧，应该会有设置，实在不行就自己做判断，如果小于第一个框选的日期，那么就不能选择，就把选出来的年月是当成数字看，然后比较就行了~

JS日历代码求助？

不需要看js 和css 。只需要修改下面就可以了：

把上面的修改为：

<input type="button" value="日期选择" onClick="fPopCalendar(event,document.getElementById('selectdate'),document.getElementById('selectdate'))"

就是在文本框后面加一个按钮，然后把文本框的点击事件放到按钮上来。

需要注意的是点击事件onClick="fPopCalendar(event,this,this)"里面的两个this，第一个this你可以不修改，它只是计算位置的，我把这两个this都换成了document.getElementById('selectdate'），单引号里是日期框的id值。这样修改后一个页面里每个日期输入框的id必须是唯一的，例如两个日期框是这样：

<input type="button" value="日期选择" onClick="fPopCalendar(event,document.getElementById('selectdate'),document.getElementById('selectdate'))"

<input type="button" value="日期选择" onClick="fPopCalendar(event,document.getElementById('selectdate2'),document.getElementById('selectdate2'))"

再说一句，按钮太丑了，换个图片多好,我们项目是这样的

js特价机票日历,PC端如何用js做点击日历选中一周

js 关于日历控件问题

把旧的日期取出来，日期部分加1就ok啊
例如：
var myDate=new Date()
myDate.setFullYear(2013, 8,27);// 8表示9月

var ret = new Date(myDate.setDate(myDate.getDate()+1));
ret = ret.getFullYear() + "-" + (ret.getMonth()+1) + "-" +ret.getDate();

alert(ret);// 次日了

js打开 Calendar日历控件？？？？？

Calendar1这个id的元素是不是存在

是不是引入了日历的js插件

日历的插件很多，你可以看一下bootstrap-datepicker。比较容易上手。

Calendar.js问题

问题呢？

lhgcalendar.js 免费吗

兼容各浏览器lhgcalendar.min.js jQuery日历插件的使用方法：
日历的各种在线演示示例
jQuery方式和普通函数式
jQuery方式调用
J(function(){
J('#inp1').calendar();
});
普通函数方式调用
function opcal(){
J.calendar.Show();
}
//输入框的代码：
<input class="runcode" id="inp2" onclick="opcal();"/>
下拉，输入，导航选择日期(年月输入框都具备以下三种特性)
通过导航图标选择
直接使用键盘输入数字
直接从弹出的下拉框中选择
常规功能使用演示
id参数(注意这里的id参数的值是左边输入框的id)，图标触发
J('#img').calendar({ id:'inp3' });
是否显示按钮栏
J('#inp4').calendar({ btnBar:false });
自动选择显示位置
当控件处在页面边界时，它会自动选择显示的位置，所以没有必要担心弹出框会被页面边界遮住的问题了。
自定义格式(其它各种自定义格式请参阅 API参数控制接口)
J('#inp5').calendar({ format:'yyyy年MM月dd日 HH时mm分ss秒' });
取得系统可识别的日期值(重要)
// 类似于 1999年7月5日这样的日期是不能够被系统识别的,他必须转换为能够识别的类型如 1999-07-05
J('#inp6').calendar({ format:'yyyy年MM月dd日', real:'realInp' });
// input文本框的代码是：
<input class="runcode" id="inp6"/><input class="runcode" id="realInp" type="text"/>
// 注意:在实际应用中,一般会把real指定为一个hidden控件,这里是为了把真实值展示出来,所以使用文本框
// 关键属性: real 指定一个控件或控件的ID,必须具有value属性(如input),用于存储真实值
真实的日期值是:
自动纠错功能
当日期框中的值不符合格式时,系统会尝试自动修复,显示当前日期。
日期范围限制
静态限制
// 限制日期的范围是 2011-04-10到2008-05-27 (注意minDate和maxDate的格式一定要是yyyy-MM-dd)
J('#inp7').calendar({ minDate:'2011-04-10', maxDate:'2011-05-27' });
动态限制(请参阅 API参数控制接口里的动态变量表)
// 只能选择今天以前的日期
J('#inp8').calendar({ maxDate:'%y-%M-%d' });
只能选择今天以后的日期
J('#inp9').calendar({ minDate:'%y-%M-%d' });
只能选择本年4月当前天到当前月的25号之间的日期
J('#inp10').calendar({ minDate:'%y-04-%d', maxDate:'%y-%M-25' });
前面的日期不能大于后面的日期
// #inp12为一个#号加上后面输入框的id
J('#inp11').calendar({ maxDate:'#inp12' });
// #inp11为一个#号加上前面输入框的id
J('#inp12').calendar({ minDate:'#inp11' });
有效期从
到
前面的日期不能大于后面的日期(targetFormat参数示例)
// #inp14为一个#号加上后面输入框的id
J('#inp13').calendar({ maxDate:'#inp14', format:'yyyyMMdd' targetFormat:'yyyy年MM月dd日' });
// #inp13为一个#号加上前面输入框的id
J('#inp14').calendar({ minDate:'#inp13', format:'yyyy年MM月dd日', targetFormat:'yyyyMMdd' });
注：如果目标文本框的日期格式不是'yyyy-MM-dd'的格式，则一定要加上targetFormat参数，指明目标文本框的日期格式
有效期从
20110511
到
2011年06月11日
无效周(可以使用此功能禁用周日至周六所对应的日期,相关属性:disWeek (0至6 分别代表周日至周六))
// 前面的输入框代码(周六所对应的日期无效)
J('#inp15').calendar({ disWeek:'6' });
// 后面的输入框代码(周日和周四所对应的日期无效)
J('#inp16').calendar({ disWeek:'0,4' });
无效日期(可以使用此功能禁用,所指定的一个或多个日期,只要你熟悉正则表达式,你可以尽情发挥)
禁用每个月份的 5日 15日 25日
// '5$' 表示以 5 结尾注意 $ 的用法
J('#inp17').calendar({ disDate:['5$'] });
禁用所有早于2000-01-01的日期
J('#inp18').calendar({ disDate:['^19'] });
禁用 2011-05-05 和 2011-05-24
J('#inp19').calendar({ disDate:['2011-05-05','2011-05-24'] });
禁用 2011-所有月份-04 和 2011-05-29
J('#inp20').calendar({ disDate:['2011-..-04','2011-05-29'] });
禁用 [2000至2008]-05-01 和 2011-05-29
J('#inp21').calendar({ disDate:['200[0-8]-05-01','2011-05-29'] });
禁用所有年份和所有月份的第7天和今天
J('#inp22').calendar({ disDate:['....-..-07','%y-%M-%d'] });
有效日期
使用无效日期可以很方便的禁用不可用的日期,但是在只需要启用少部分日期的情况下,有效日期的功能就非常适合了
关键属性: enDate 默认为false, 为true时,无效日期变成有效日期
启用每个月份的 5日 15日 25日
J('#inp23').calendar({ disDate:['5$'], enDate:true });
自定义事件
自定义事件
如果你需要做一些附加的操作,你也不必担心,日期控件自带的自定义事件可以满足你的需求.此外,你还可以在自定义事件中调用提供的API库来做更多的运算和扩展,绝对可以通过很少的代码满足你及其个性化的需求.
注意下面几个重要的指针,将对你的编程带来很多便利
this: 指向日历对象实例，也就是J.calendar对象
this.inpObj: 指向文本框
this.cal: 指向日历控件对象
注意:函数原型必须使用类似 function(dp){} 的模式,这样子,在函数内部才可以使用this
onSetDate事件
J('#inp24').calendar({ onSetDate:function(){alert(this.inpObj.value);} });
2011-05-12
getDateStr()用法
// getDateStr的参数用法请参阅 API参数控制接口
J('#inp25').calendar({ onSetDate:function(){alert('日期框原来的值为:'+this.inpObj.value+',要用新选择的值:'+this.getDateStr('date')+'覆盖吗?');} });
2011-05-12

js做的日历选择日期后，触发验证控件

onchange="你的事件名称"