我想动态计算日期和时间差异,但它显示1970年的第一个文本框日期值,仅以小时为单位。这里有一些代码,我应该遵循这种代码方法还是应该尝试不同的东西? 代码:
<ol id="boxes">
</ol>
<input type="button" value="Add a row" id="add_boxes" />
<br> final result of all days and time boxes:
<!-- here in these textboxes we want to show total difference calculated in all boxes-->
<input type="text" value="" id="final_result" placeholder="total_days (like 15 days)" /> <input type="text" value="" id="final_result" placeholder="total_hours (like 18 hours" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script>
var add = $('#add_boxes');
var all = $('#boxes');
var amountOfInputs = 2;
var maximumBoxes = 10;
add.click(function(event) {
// create a limit
// if ($(".box").length >= maximumBoxes) {
// alert("You cannot have more than 10 boxes!");
// return;
// }
var listItem = $('<li class="box"></li>');
// we will add 2 boxes here, but we can modify this in the amountOfBoxes value
for (var i = 0; i < amountOfInputs; i++) {
listItem.append('<input type="date" class="input1" /> <input type="time" class="input2" name="starttime"/>');
}
<!-- here in both textbox we want to show difference between both date and time-->
listItem.append('output should be like this : <input type="text" class="output" name="value" placeholder="like(2 days)"/> <input type="text" class="output" name="value" placeholder="like(5 hours)"/>');
// Lets add a link to remove this group as well, with a removeGroup class
listItem.append('<input type="button" value="Remove" class="removeGroup" />')
listItem.appendTo(all);
});
// This will tie in ANY input you add to the page. I have added them with the class `input`, but you can use any class you want, as long as you target it correctly.
$(document).on("change", "input.input1", function(event) {
// Get the group
var group = $(this).parent();
// Get the children (all that arent the .output input)
var children = group.children("input:not(.output)");
// Get the input where you want to print the output
var output = group.children(".output");
// Set a value
var value = 0;
// Here we will run through every input and add its value
children.each(function() {
value = Date.parse(this.value);
var second_hours = parseInt(value)/1000/60/60;
var hours_day = parseInt(second_hours)/24;
alert(hours_day);
// Add the value of every box. If parseInt fails, add 0.
// console.log(this)
// value += parseInt(this.value) || 0;
// var a = parseInt(value);
});
// Print the output value
output.val(value);
var totValue = 0;
$('.output').each(function() {
// Add the value of every box. If parseInt fails, add 0.
totValue += parseInt(this.value) || 0;
});
//document.getElementById('final_result').value = value;
$('#final_result').val(totValue);
var test = document.getElementById('final_result').value
var b = parseInt(test) + parseInt(a);
alert(a);
});
// Lets implement your remove field option by removing the groups parent div on click
$(document).on("click", ".removeGroup", function(event) {
event.preventDefault();
var removedValue = parseInt($(this).parent().find('.output').val(), 10) || 0;
var prevValue = parseInt($('#final_result').val(), 10) || 0;
$('#final_result').val(prevValue - removedValue);
$(this).parent(".box").remove();
});
</script>