[英]Jquery set date to input value
I have start_date datepicker and after some calculation result shown on date_result textfield and its working fine, here is code: 我有start_date datepicker,并且在date_result文本字段上显示了一些计算结果之后,它的工作正常,这是代码:
jQuery(document).ready(function($) {
$('start_date, #week_number, #year_number, #month_number').change(function() {
var yr = $('#year_number').val() * 365;
var wk = $('#week_number').val() * 7;
var days = yr + wk;
var endDate = new Date($('#start_date').val());
endDate.setDate(endDate.getDate() + Number(days));
$('#date_result').val(endDate.getFullYear() + '-' + (endDate.getMonth() + 1) + '-' + endDate.getDate());
});
});
Problem: The date_result input value is empty, how can I set this value with calculated date? 问题: date_result输入值为空,如何用计算的日期设置此值?
<input type="text" value="" size="20" name="form[date_result]" id="date_result">
Adding months in Javascript generally may not always work as expected as some scenarios and edge-cases can lead to unexpected results. 通常,在Javascript中添加月份可能并不总是能按预期工作,因为某些情况和边缘情况可能会导致意外结果。
For instance, the setMonth()
function accepts only month values between 0-11 and also accepts a day parameter and can do some funny things when values outside of this range are used : 例如,
setMonth()
函数仅接受介于0到11之间的月份值,并且还接受day参数,并且在使用此范围之外的值时可以做一些有趣的事情:
If a parameter you specify is outside of the expected range,
setMonth()
attempts to update the date information in theDate
object accordingly.如果您指定的参数超出预期范围,则
setMonth()
尝试相应地更新Date
对象中的日期信息。 For example, if you use 15 formonthValue
, the year will be incremented by 1, and 3 will be used for month.例如,如果将15用作
monthValue
,则年份将增加1,并将3用作月份。
Consider using a Date-specific Library 考虑使用特定日期的库
My recommendation would be to consider using a library like Moment.js or Date.js , which are specifically designed for handling this type of behavior and will likely make your code much easier to read : 我的建议是考虑使用像Moment.js或Date.js这样的库,它们是专门为处理这种类型的行为而设计的,可能会使您的代码更易于阅读:
$('#start_date, #month_number').change(function() {
var months = $('#month_number').val();
// Get your date as a moment (specifying the format you want to parse in)
var end = moment($('#start_date').val(),"YYYY-MM-DD");
// Add your months
end.add(Number(months),'months');
// You can even ease formatting (along with output format)
$('#end_date').val(end.format('YYYY-MM-DD'));
});
Example 例
<!DOCTYPE html> <html> <head> <script src="https://cdn.jsdelivr.net/momentjs/2.10.6/moment-with-locales.min.js"></script> <script src="https://code.jquery.com/jquery-2.1.4.js"></script> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>JS Bin</title> </head> <body> <input type="date" id="start_date"> <select id="month_number"> <option value="0">Number of months to add</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> <option value="11">11</option> <option value="12">12</option> </select> <input type="text" id="end_date" placeholder="End Date"> <script> $(function() { $('#start_date, #month_number').change(function() { var months = $('#month_number').val(); // Get your date as a moment var end = moment($('#start_date').val(), "YYYY-MM-DD"); // Add your months end.add(Number(months), 'months'); // You can even ease formatting $('#end_date').val(end.format('YYYY-MM-DD')); }); }); </script> </body> </html>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.