Javascript 计算日期并将值发送到文本框

Question

我的 Javascript 代码如下:

function addRowss(frm) {
        var start = new Date(document.myform.bookstart.value);
        var ends = new Date(document.myform.bookend.value);

        var starts = document.myform.bookstart.value;
        var yeara = starts.substring(0, 2);
        var montha = starts.substring(3,6);
        var datea = starts.substring(7,11);
        var num3 = (ends - start)/1000/60/60/24;
        var i;

        for(i=0;i <= num3; i++)
        {                   
            var theday = yeara+'-'+getnumo(montha)+'-'+datea;
            var resday = new Date(theday);
            rowNum ++;
            var row = '<p id="rowNum'+rowNum+'">Date: <input type="text" class="datepick" name="qty[]" id="date'+rowNum+'" value="'+theday+'"> Price: <input type="text" name="name[]" value="'+frm.add_name.value+'"> <input type="button" value="Remove" onclick="removeRow('+rowNum+');"></p>';
            jQuery('#itemRows').append(row);
            yeara++;
        }
    }

我想要做的是文本名称[]将由我的开始日期到结束日期自动填充。例如，如果我在开始输入处填写“06-Aug-2015”，在结束输入处填写“06-Sep-2015”，则会产生大约 30 个文本框字段，其值将由其日期填充...所以它将结果:

[2015-08-06][ empty ]
[2015-08-07][ empty ]
[2015-08-08]
...
[2015-09-06][ empty ]
Note: [ ] = textbox

现在我可以添加很多文本框(附件图片)，但我无法根据需要设置此文本框的值。有什么想法吗？

Answer 1

您应该编写一个函数来将该格式解析为 Date 对象，它是一种非标准格式，因此不能保证 Date 构造函数能够在所有浏览器中正确解析它。然后创建一个函数，以您需要的格式从 Date 对象创建日期字符串。现在，您可以生成行并只需调用函数来添加格式化字符串，同时将日期增加一天。

以下是我重写代码的方法，您可以删除 rowNum 变量，我已经修改了删除监听器和函数，因此不需要它。

// '06-Sep-2015' to Date
function parseDMY(s) {
  var months = {jan:0, feb:1, mar:2, apr:3, may:4,  jun:5, jul:6, aug:7, sep:8, oct:9, nov:10, dec:11};
  var b = s.split('-');
  return new Date(b[2],months[b[1].toLowerCase().substring(0,3)],b[0]);
}

// Date to '06-Sep-2015'
function formatDate(date) {
  var months = ['Jan','Feb','Mar','Apr','May','Jun', 'Jul','Aug','Sep','Oct','Nov','Dec'];
  function z(n){return (n<10? '0' : '') + n;}
  return z(date.getDate()) + '-' + months[date.getMonth()] + '-' + date.getFullYear();
}

function addRows(frm) {
    var start = parseDMY(frm.bookstart.value);
    var ends   = parseDMY(frm.bookend.value);
    var markup = '';
    var num3 = Math.round((ends - start)/8.64e7);
    var rowNum = 0;

    for(var i=0; i <= num3; i++) {
        var theday = formatDate(start);
        ++rowNum;
        markup += '<p id="rowNum' + rowNum + '">Date: <input type="text" class="datepick" name="qty[]" id="date' +
                   rowNum + '" value="' + theday + '"> Price: <input type="text" name="name[]" value="' +
                   frm.add_name.value + '"> <input type="button" value="Remove" onclick="removeRow(this);"></p>';
        start.setDate(start.getDate() + 1);        
    }
    document.getElementById('itemRows').innerHTML = markup;
}

function removeRow(el) {
  var node = el.parentNode;
  node.parentNode.removeChild(node);
}

<form id="bookingForm">
  <table>
   <tr><td>Start date<td><input name="bookstart" value="05-Aug-2015">
   <tr><td>End date<td><input name="bookend" value="08-Aug-2015">
   <tr><td><input name="add_name" value="the name">
   <tr><td><input type="reset"><td><input type="button" value="Add rows" onclick="addRows(this.form)">
  </table>
  <div id="itemRows"></div>
</form>