添加使用 JS 的日期输入的第二次使用使它们都不起作用

Adding a second use of a date input which uses JS makes neither of them work

本文关键字:不起作用 日期 JS 添加 输入 第二次      更新时间:2023-09-26

我有三个选择,一个用于月,一个用于日,一个用于年份。我有一些基本的JS,当修改三个选择之一时,它会更新文本输入框。

.HTML:

<select name="month" class="month" onchange="setDate(this,day,year)">
    <option value="1">January</option>...
</select>
<select name="day" class="day" onchange="setDate(month,this,year)">
    <option value="1">1</option>...
</select>
<select name="year" class="year" onchange="setDate(month,day,this)">
    <option value="2012">2012</option>...
</select>
<input type="text" name="hidden" value="" />

这工作得很好,但我想添加另一组这三个输入。当我这样做(制作上面的 HTML 的另一个副本(时,它们都不起作用。也就是说,在修改(选择(选择时,文本输入框未更新/给定日期。

JavaScript(相关部分(:

function setDate(month_selection, day_selection, year_selection)
{
    //Month, Day and Year variables created
    form.hidden.value = month + '/' + day + '/' + year;
}

关于为什么它仅在我只有一个 HTML 副本时才有效以及如何解决此问题以便我可以拥有两组这些选择的任何想法?

编辑:我已经通过提供输入以及为 HTML 的每个"副本"选择不同的名称来解决这个问题。

我现在遇到了一个新问题,即如何根据要更改的输入更新正确的文本框。

如果我把它放在我的 setDate 函数的末尾:

form.hidden.value = month + '/' + day + '/' + year;
form.hidden_two.value = month + '/' + day + '/' + year;

当其中任何一个被更改时,它将更新它们两个的文本框(显然(。有谁知道让它更新正确文本框的方法?

只是一个想法,但您是否正在更改新输入的名称?如果您有两个"隐藏"输入框,则它不起作用。

新东西 :

当然,您必须将所有字段的名称更改为 =月,日,年和隐藏。然后在 JS 函数中,您可以确定哪个字段更改提示脚本执行......我会这样想:

function setDate(month_selection, day_selection, year_selection)
{
   if (month_selection.name=='month'){
      var hidden = document.getElementsBynName('hidden');
   } 
   if (month_selection.name=='month_two'){
      var hidden = document.getElementsByName('hidden_two');
   } 
//Month, Day and Year variables created
   hidden.value = month + '/' + day + '/' + year;
}

这不是一个精确的解决方案,只是一个指向如何解决它的指针。