Question

我为用户提供了三个输入日期，活动和时间。在页面开始的日期字段中，我希望日期中的日期打印在标签中，例如：2015-12-20，如果她/他想要，用户可以更改它。但我尝试用一个功能，但不能让它工作。

以下是我的代码：

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<link href="6.1.css" rel="stylesheet" type="text/css"/>
</head>
<body>

<form>
Date: <input type="text" id="Datum" name="Date" value=DateTime()>
Activity: <input type="text" id="Activity" name="Activ">
Time: <input type="text" id="time" name="Time">
 <input type="button" onclick="AddRow()" value="Lägg till data!">
</form>



<table id="myTable">
 <tr>       
    <td>Datum</td>
    <td>Aktivit</td>
    <td>Tid</td>
    <td>Klar?</td>
 </tr>
</table>

 <button id="buttonforsend" onclick="SendData()">Skicka grönmarkerad data!     </button> 

<script>

function DateTime() {
var s = document.getElementById("Datum");
s = "";
var myYear = new Date();

s += myYear.getFullYear() + "-";
s += (myYear.getMonth() + 1) + "-";
s += myYear.getDate();

return s;
}


function AddRow() 
{

  var $check = document.createElement("INPUT");
$check.setAttribute("type", "checkbox");
$check.setAttribute("checked", "true");
$check.setAttribute("class", "checks");
$check.addEventListener("click", toggleClass);


function toggleClass() {

if (this.checked == true) {
this.parentNode.parentNode.className = "Green";

} else {
this.parentNode.parentNode.className = "Red";
}
}

var date = document.getElementById("Datum");
var activity = document.getElementById("Activity");
var time = document.getElementById("time");

var table = document.getElementById("myTable");

var rowCount = table.rows.length;
var row = table.insertRow(rowCount);


row.insertCell(0).innerHTML = date.value;
row.insertCell(1).innerHTML = activity.value;
row.insertCell(2).innerHTML = time.value;
row.insertCell(3).appendChild($check).value;

}

function addTable() {

var myTableDiv = document.getElementById("myDynamicTable");

var table = document.createElement('TABLE');

var tableBody = document.createElement('TBODY');
table.appendChild(tableBody);

for (var i = 0; i < 3; i++) {

var tr = document.createElement('TR');
tableBody.appendChild(tr);

for (var j = 0; j < 4; j++) {
var td = document.createElement('TD');
td.appendChild(document.createTextNode("Cell " + i + "," + j));
tr.appendChild(td);
}
}
 myTableDiv.appendChild(table);

 }


function CheckData() {

var $arr = [];
var tb = document.getElementById("myTable");
var checks = tb.querySelectorAll(".checks"),

chk, tr;

for (var i = 0; i < checks.length; i++) {
chk = checks[i];
if (chk.checked) {
 tr = chk.closest ? chk.closest('tr') : chk.parentNode.parentNode;
  $arr.push({
    date: tr.cells[0].innerText,
    activity: tr.cells[1].innerText,
    time: tr.cells[2].innerText
  });
}
}
return $arr;
}


function SendData() 
{

var obj = {Data: CheckData()}; 
var jsonString = "jsonString=" + (JSON.stringify(obj));
var xmlhttp = new XMLHttpRequest();

xmlhttp.open("POST","JSON_H.php",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-  urlencoded");
xmlhttp.setRequestHeader("Content-Length", jsonString.length);

xmlhttp.onreadystatechange = function() 
{           
  if(xmlhttp.readyState === 4 && (xmlhttp.status === 200)){
      alert(xmlhttp.responseText);
  } 
};
xmlhttp.send(jsonString);
}
</script>

</body>
</html>

Answer 1

您需要致电DateTime并在input字段中插入其值，设置value=DateTime()将不会设置该值。例如：

document.getElementById("Datum").value=DateTime();

完整代码：

function DateTime() {
var s = document.getElementById("Datum");
s = "";
var myYear = new Date();

s += myYear.getFullYear() + "-";
s += (myYear.getMonth() + 1) + "-";
s += myYear.getDate();

return s;
}


document.getElementById("Datum").value=DateTime(); // This will insert the value

<form>
Date: <input type="text" id="Datum" name="Date" value="">
Activity: <input type="text" id="Activity" name="Activ">
Time: <input type="text" id="time" name="Time">
 <input type="button" onclick="AddRow()" value="Lägg till data!">
</form>

使用输入类型打印年 - mm-dd中的日期

1 个答案: