Javascript两个日期选择器冲突
Javascript two datepicker conflict
这是我的代码完整代码:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Date Picker</title>
</head>
<body>
<strong>Departing:</strong><br/>
<select name='dateSingleMonthDeparting' onChange='changeDate(this.options[selectedIndex].value);'>
<option value='na'>Month</option>
<option value='1'>January</option>
<option value='2'>February</option>
<option value='3'>March</option>
<option value='4'>April</option>
<option value='5'>May</option>
<option value='6'>June</option>
<option value='7'>July</option>
<option value='8'>August</option>
<option value='9'>September</option>
<option value='10'>October</option>
<option value='11'>November</option>
<option value='12'>December</option>
</select>
<select name='dateSingleDayDeparting' id='day'>
<option value='na'>Day</option>
</select>
<select name='dateSingleYearDeparting' id='year'>
<option value='na'>Year</option>
</select><br/>
<strong>Returning:</strong><br/>
<select name='dateSingleMonthReturning' onChange='changeDate(this.options[selectedIndex].value);'>
<option value='na'>Month</option>
<option value='1'>January</option>
<option value='2'>February</option>
<option value='3'>March</option>
<option value='4'>April</option>
<option value='5'>May</option>
<option value='6'>June</option>
<option value='7'>July</option>
<option value='8'>August</option>
<option value='9'>September</option>
<option value='10'>October</option>
<option value='11'>November</option>
<option value='12'>December</option>
</select>
<select name='dateSingleDayReturning' id='day'>
<option value='na'>Day</option>
</select>
<select name='dateSingleYearReturning' id='year'>
<option value='na'>Year</option>
</select>
<script>
function changeDate(i){
var e = document.getElementById('day');
while(e.length>0){
e.remove(e.length-1);
var j=-1;
if(i=="na"){
k=0;
}else if(i==2){
k=28;
}else if(i==4||i==6||i==9||i==11){
k=30;
}else{
k=31;
}
}
while(j++<k){
var s=document.createElement('option');
var e=document.getElementById('day');
if(j==0){
s.text="Day";
s.value="na";
try{
e.add(s,null);
}catch(ex){
e.add(s);
}
}
else{
s.text=j;
s.value=j;
try{
e.add(s,null);
}catch(ex){
e.add(s);
}
}
}
}
var currentTime = new Date();
y = currentTime.getFullYear()+1;
while (y-->1909){
var s = document.createElement('option');
var e = document.getElementById('year');
s.text=y;
s.value=y;
try{
e.add(s,null);
}catch(ex){
e.add(s);
}
}
</script>
</body>
</html>
我有两个约会对象。当我更改第一个时,它工作得很好,但如果我更改第二个,函数将在第一个datepciker 中工作
我希望他们对每个日期选择器都有自己的功能。我该怎么做才能做到这一点?我已经尝试过制作类似于getElementById('day day2')
的put,但它不起作用。
您的select
已在标记中两次分配ID day
和year
。这是错误的。ID应该是唯一的。
请将这些ID更改为第1天、第1年、第2天和第2年。然后将这些id作为参数传递到像这个changeDate(this.value, "day1", "year1")
和这个changeDate(this.value, "day2", "year2")
这样的函数中。
现在将changeDate定义为
function changeDate(i, day, year) {
var e = document.getElementById( day ); // please note that day is the variable passed
...................
}
作为一个无关的旁注,this.options[selectedIndex].value
与this.value
相同
相关文章:
- jquery日期选择器年份范围默认值
- jquery日期选择器失去了交互性
- 正在搜索JavaScript日期选择器滑块
- 如何在多个jQueryUI日期选择器中屏蔽特定日期
- jquery日期选择器显示与值不同的文本
- JQuery UI日期选择器:在选择出发日期时自动弹出返回日期
- Angular UI启动日期选择器问题
- 奇怪的日期选择器行为,与模糊有关
- 我希望这个日期选择器可以从1990年到2000年之间的年份中选择日期
- keith wood日期选择器日期格式和语言
- 在日期更改后更新Angular UI引导程序日期选择器选项
- Jquery UI日期选择器不关注输入
- Javascript两个日期选择器冲突
- 动态添加的标记不会'无法正确使用日期选择器
- 日期选择器无法使用javascript显示
- AngularJS自定义日期选择器指令
- 他们网站上的代码出现启动日期选择器错误
- 从第一个日期选择器定义第二个日期选择器的开始日期
- 更改日期选择器格式
- 带有推特助推器的日期选择器出现了,但没有't更改日期