Javascript：如何在onChange事件期间更改日期时间值？

每当用户更改下拉列表的值时，我都需要更改输入框的值。值应该是“当前日期时间”，我不能使它工作。使用下面的代码，每次更改特定行的下拉值（比如说第3行），所有行中输入框（当前日期时间）的值都会受到影响。它们具有相同的当前日期时间值。其他行的当前日期时间值不应该改变。只有用户更改下拉列的行。我在这里错过了什么吗？顺便说一句，我必须使用DOM。Javascript：如何在onChange事件期间更改日期时间值？

<table id="myTable"> 
     <tr> 
     <td>Value to Select: <select onChange="changeDateTime();"></select></td> 
     <td>Current Date Time: <input/></td> 

     </tr> 
    </table>

的Javascript：

function changeDateTime(){ 

    var today = new Date(); 
    var date = today.getFullYear()+'-'+(today.getMonth()+1)+'-'+today.getDate(); 
    var time = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds(); 
    var currentDateTime = date+' '+time; 

    var d = id('myTable', document); 
    for (var x=1; x<d.rows.length; x++) {      
     d.rows[x].cells[2].firstChild.value = currentDateTime; 
     } 
}

来源

2016-05-13 Ti J

jsfiddle please .. –

看起来错在这里是你应该从0开始的索引

for (var x=0; x<d.rows.length; x++) {      
    d.rows[x].cells[2].firstChild.value = currentDateTime; 
}

来源

2016-05-13 08:55:30

如何检查select下拉列表中的值是否更改？ –

你已经写过这个回调 ...........所以changeDateTime函数只会在选择改变后才会调用 –

我做你的HTML一些变化来把一些数据首先映入选择列表。请看下图：

<table id="myTable"> 
    <tr> 
    <td>Value to Select: <select onchange="javascript:changeDateTime();"> 
     <option>-- select --</option><option>ShowDate</option> 

    </select></td> 
    <td>Current Date Time: <input id="txtDate"/></td> 

    </tr> 
</table>

而且，做了一些改变javascript函数，该图是由ID获取文本框的文本框日期时间。

function changeDateTime(){ 
    var today = new Date(); 
    var date = today.getFullYear()+'-'+(today.getMonth()+1)+'-'+today.getDate(); 
    var time = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds(); 
    var currentDateTime = date+' '+time; 
    document.getElementById('txtDate').value = currentDateTime; 
}

fiddle

希望你的作品！

来源

2016-05-13 08:56:53

检查下面的代码段。

function changeDateTime(obj) { 
 
    var today = new Date(); 
 
    var date = today.getFullYear() + '-' + (today.getMonth() + 1) + '-' + today.getDate(); 
 
    var time = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds(); 
 
    var currentDateTime = date + ' ' + time; 
 

 
    var _input = obj.parentNode.nextElementSibling.getElementsByTagName('input')[0] 
 
    _input.value = currentDateTime; 
 
}

<table id="myTable"> 
 
    <tr> 
 
    <td>Value to Select: 
 
     <select onChange="changeDateTime(this);"> 
 
     <option>1</option> 
 
     <option>2</option> 
 
     </select> 
 
    </td> 
 
    <td>Current Date Time: 
 
     <input/> 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td>Value to Select: 
 
     <select onChange="changeDateTime(this);"> 
 
     <option>3</option> 
 
     <option>4</option> 
 
     </select> 
 
    </td> 
 
    <td>Current Date Time: 
 
     <input /> 
 
    </td> 
 
    </tr> 
 
</table>

来源

2016-05-13 09:09:01 Pugazh

记住数组从0开始，所以你的脚本应该是这样的

var d = document.getElementById("myTable"); 
for (var x=0; x<d.rows.length; x++) { 
    d.rows[x].cells[1].lastChild.value = currentDateTime; 
}

也输入字段不是firstChild。

Working Example

注：

这样，你改变每行的日期，如果你要的是不知道。如果不是，我会用Pugazh答案。

来源

2016-05-13 09:16:29

您正在使用firstChild，您真正需要的是firstElementChild属性。有几个types of nodes可用，并且您正在寻找的是Element类型的节点。

你的代码不起作用的原因（除了数组索引应该从0开始，所以x=0和cell[1]）实际上是firstChild是一个类型为text的节点，而不是输入元素节点。做不是使用lastChild，因为你不知道是否会有一个空的文本节点。

可以通过为输入标记设置class属性来实现easyer方式，因此您可以使用getElementsByClassName（）函数。

如果你仍然想这样做，这里是解决方案。纠正这个循环，你很好。

for (var x=0; x<d.rows.length; x++) { 
      d.rows[x].cells[1].firstElementChild.value = currentDateTime; 
}

来源

2016-05-13 09:44:11 Borna

Javascript：如何在onChange事件期间更改日期时间值？

回答

相关问题