我想找到一种方法来计算2个日期之间的差异,并在提交表单之前显示结果。这与签入类似 - 检查http://www.booking.com/中黄色/橙色框中的下拉菜单,其中选择日期立即显示的夜晚。
JS Fiddle中显示的HTML代码版本:http://jsfiddle.net/chri_chri/xy2gpa02/2/
用于生成下拉日期选择器的代码
<?php
// displays days with leading 0s
$options = array();
for ($i=1; $i<32; $i++) {
$theday = date('d', mktime(0,0,0,0,$i,2000));
$sel = ($i == date('d') ? 'selected="selected"' : '');
$options[] = "<option value= \"{$theday}\" {$sel}>{$theday}
</option>";
}
$options_list = join("\r\n", $options);
echo "<div class='select' id='date'><select class=\"short-input\" name=\"day_from\">{$options_list}</select></div>";
?>
<?php
$options = array();
for ($i = 1; $i<13; $i++) {
$themonth = date('F', mktime(0,0,0,$i,2, 2000));
$month = date('m', mktime(0,0,0,$i,2,2000));
$sel =($i == date('n') ? ' selected="selected"' : '');
$options[] = "<option value=\"{$month}\" {$sel}>{$themonth}
</option>";
}
$options_list = join("\r\n", $options);
echo "<div class='select' id='month'><select class=\"short-input\" name=\"month_from\" size=\"1\">{$options_list}</select></div>";
?>
<?php
/* build selection list for the year */
$today = time(); // stores today's date
$startYr = date("Y", $today); // get the year from $today
echo "<div class='select' id='year'>
<select class='short-input' name='year_from'>\n";
for ($year=$startYr;$year<=$startYr+10;$year++)
{
echo " <option value= $year";
if ($startYr == $year)
{
echo "";
}
echo " > $year</option>\n";
}
echo "</select>\n</div>\n";
?>
答案 0 :(得分:0)
你有两个选择,使用java-script或将表单提交到php文件并处理表单。 jsfiddle工作示例http://jsfiddle.net/mdamia/3b5fyzjL/32/
//脚本
function stayCost() {
var dayFrom = $('.day-from').val();
var monthFrom = $('.month-from').val();
var yearFrom = $('.year-from').val();
var dateFrom = Date.parse(monthFrom + ' ' + dayFrom + ' ' + yearFrom);
var dayTo = $('.day-to').val();
var monthTo = $('.month-to').val();
var yearTo = $('.year-to').val();
var dateTo = Date.parse(monthTo + ' ' + dayTo + ' ' + yearTo);
var dateDifference = dateTo - dateFrom;
var diffInDays = Math.ceil(dateDifference / (1000 * 3600 * 24));
$('.days').text(diffInDays);
$('.cost').text(diffInDays * 40);
}
stayCost();
$('.day-to').change(function () {
stayCost();
});