2013-03-11 42 views
1

我想要在表单中自动选择月份,日期和年份。我确信这很简单,但我对Javascript很不熟悉。在下面的代码中,月份选择工作正常,但一天总是实际日的+1,而年份根本不工作。如果有人能帮助它将非常感激!谢谢!Javascript日/月/年进入表格

<form name="form" action="b.html" method="post"> 
    <select id="month" name="month"> 
     <option id="1" value="January">January</option> 
     <option id="2" value="February">February</option> 
     <option id="3" value="March">March</option> 
     <option id="4" value="April">April</option> 
     <option id="5" value="May">May</option> 
     <option id="6" value="June">June</option> 
     <option id="7" value="July">July</option> 
     <option id="8" value="August">August</option> 
     <option id="9" value="September">September</option> 
     <option id="10" value="October">October</option> 
     <option id="11" value="November">November</option> 
     <option id="12" value="December">December</option> 
    </select> 
    /
    <select id="day" name="day"> 
     <option id="1" value="1">1</option> 
     <option id="2" value="2">2</option> 
     <option id="3" value="3">3</option> 
     <option id="4" value="4">4</option> 
     <option id="5" value="5">5</option> 
     <option id="6" value="6">6</option> 
     <option id="7" value="7">7</option> 
     <option id="8" value="8">8</option> 
     <option id="9" value="9">9</option> 
     <option id="10" value="10">10</option> 
     <option id="11" value="11">11</option> 
     <option id="12" value="12">12</option> 
     <option id="13" value="13">13</option> 
     <option id="14" value="14">14</option> 
     <option id="15" value="15">15</option> 
     <option id="16" value="16">16</option> 
     <option id="17" value="17">17</option> 
     <option id="18" value="18">18</option> 
     <option id="19" value="19">19</option> 
     <option id="20" value="20">20</option> 
     <option id="21" value="21">21</option> 
     <option id="22" value="22">22</option> 
     <option id="23" value="23">23</option> 
     <option id="24" value="24">24</option> 
     <option id="25" value="25">25</option> 
     <option id="26" value="26">26</option> 
     <option id="27" value="27">27</option> 
     <option id="28" value="28">28</option> 
     <option id="29" value="29">29</option> 
     <option id="30" value="30">30</option> 
     <option id="31" value="31">31</option> 
    </select> 
    /
    <select id="year" name="year"> 
     <option id="2012" value="2012">2012</option> 
     <option id="2013" value="2013">2013</option> 
     <option id="2014" value="2014">2014</option> 
     <option id="2015" value="2015">2015</option> 
     <option id="2016" value="2016">2016</option> 
     <option id="2017" value="2013">2017</option> 
     <option id="2018" value="2014">2018</option> 
     <option id="2019" value="2015">2019</option> 
     <option id="2020" value="2016">2020</option> 
    </select> 

    <script> 
    var d = new Date(); 
    var month = d.getMonth(); 
    var day = d.getDate(); 
    var year = d.getFullYear(); 
    document.form.month[month].selected = month; 
    document.form.day[day].selected = day; 
    document.form.year[year].selected = year; 
    </script> 
</form> 
+0

什么是你的代码错误? – powtac 2013-03-11 17:58:09

+2

“不工作”是一个足够的问题描述。 – 2013-03-11 17:58:38

+0

我从来不喜欢用'select'来进行日期管理。允许像2月31日那样的日期很容易。 – 2013-03-11 18:00:07

回答

-2

您正尝试通过各自的索引访问元素。当您访问月份时,它会显示正确的月份,这是巧合,因为1月份的getMonth()返回0。当您选择第三个月(索引= 2)时,它正确选择March作为index=2的元素。

对于日期和年份,我改为将您的代码更改为.value。你不能这样做一个月,因为你使用的值是一月,二月,三月等,而不是它们的指数。

<script> 
    var d = new Date(); 
    var month = d.getMonth(); 
    var day = d.getDate(); 
    var year = d.getFullYear(); 
    document.form.month.options[month].selected = true; 
    document.form.day.value = day; 
    document.form.year.value = year; 
</script> 
+0

感谢您和其他已回答问题的人! – Matt 2013-03-11 18:29:43

+0

这个选择的答案是越野车,它将一个布尔值设置为一个数字。一月会发生什么?它失败!!!! -1 – epascarello 2013-03-11 19:19:10

+0

它已经修复:) – rationalboss 2013-03-11 23:43:03

1

你有冲突的ID! ID是页面上的单数值。 Selected是一个布尔值,你将它设置为一个数字。

摆脱对IDS,

var d = new Date(); 
var month = d.getMonth(); 
var day = d.getDate(); 
var year = d.getFullYear(); 
document.form.month.options[month].selected = true; 
document.form.day.options[day-1].selected = true; 
document.form.year.options[year-2012].selected = true; 
+0

例如:http://jsfiddle.net/Ym4VM/ – epascarello 2013-03-11 18:09:11

+0

我应该提到上面的代码在选项的基于零的索引上工作。月份是基于零的,所以我们不需要减去一个。需要从一天中减去一个以使该零为基础。最后减去第一年可能会使该年度为零。 – epascarello 2013-03-11 19:18:22

1

此代码:

var day = d.getDate(); 
... 
document.form.year[year].selected = true; 

应该

var day = d.getDate()-1; 
... 
document.form.year[year - 2012].selected = true; 

当天必须减去1,因为这一部分:document.form.day[day]是一个数组,记住数组从0开始,但getDate()从1开始。

为什么你不需要在月份部分减1?因为JavaScript Date Object's month index begins with 0!

+0

@Steve:你先试过我的代码吗? – 2013-03-11 18:08:34

+0

你为什么要设置布尔值为数字? – epascarello 2013-03-11 18:09:57

+0

我想这将有助于解释为什么你需要减去1.你的代码看起来像返回的日期不正确,而你正在尝试调整索引偏移量。这样@epascarello的答案使它更清洁。 – Steve 2013-03-11 18:12:23

0

select-element中的选项由索引[0]开始访问。

,导致:

document.form.month[0].value is 'January' 
document.form.day[0].value is 1; 
document.form.year[0].selected is 2012; 

一定要正确计算您的索引或使用你的项目的价值指标:

var year = d.getFullYear(); 
document.getElementById('year').value = year; 

并请从选项中删除了“id”属性。在文档中使用相同的ID两次是不好的做法。它应该为元素的独特

相关问题