我有下面的JavaScript计算代码来计算两个日期之间的差异。我有一个conference_date_out
字段的.change
事件的函数,但是,如果我返回并更改date_in
日期-"total days"中的计算不更新。我做错了什么?
JavaScript语言:
<script type="text/javascript">
$(function () {
$(".datepicker").datepicker({
dateFormat: 'dd-mm-yy'
})({
changeMonth: true,
changeYear: true
});
$(".datepicker").datepicker;
});
$('#conference_date_out').change(function () {
var start = $('#conference_date_in').datepicker('getDate');
var end = $('#conference_date_out').datepicker('getDate');
var days = (end - start) / 1000 / 60 / 60 / 24;
document.getElementById('total_days').value = days;
});
</script>
超文本:
<title>Conference Form</title>
<script type="text/javascript" src="css/jqueryui.css"></script>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jqueryui.js"></script>
<link href="style.css" rel="stylesheet" type="text/css" />
<link href="css/jqueryui.css" rel="stylesheet" type="text/css" />
<body>
<div id="wrapper">
<div id="header"></div>
<table width="705" border="1" align="left" cellpadding="1">
<form action="" method="get" name="myform">
<tr>
<td width="151">
<label>Company Name</label>
</td>
<td width="158">
<input type="text" name="companyname" id="companyname" />
</td>
<td width="155">Enquiry Date</td>
<td width="213">
<input type="text" name="enquiry_date" id="enquiry_date" />
</td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Conference Date In</td>
<td>
<input type="text" name="conference_date_in" id="conference_date_in" class="datepicker"
/>
</td>
<td>Conference Date Out</td>
<td>
<input type="text" name="conference_date_out" id="conference_date_out"
class="datepicker" />
</td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>Number of Delegates</td>
<td>
<input type="text" name="no_of_delegates" id="no_of_delegates" />
</td>
<td>Total Days</td>
<td>
<input type="text" name="total_days" id="total_days" />
</td>
</tr>
</form>
</table>
</div>
</body>
</html>
3条答案
按热度按时间mec1mxoz1#
很简单:只将
change
处理程序绑定到#conference_date_out
,而不绑定到#conference_date_in
。mf98qq942#
您只将更新函数绑定到“out”字段。请尝试以下操作:
vqlkdk9b3#
您可以按如下方式简化jquery:
1.将共享类添加到您的会议日期:
<input class="conference_date" name="conference_date_out"/>
...
<input class="conference_date" name="conference_date_out"/>
1.则可以使用以下命令侦听两者的更改:
一米三米一x
而不是:
$('#conference_date_in').add('#conference_date_out').change(function() {
您保存了JavaScript代码,并且可以将共享类用于其他侦听器/样式。