Question

我有一个使用datepicker的开始日期和结束日期的表单。

<input name="dateBegin" id="start" type="text" title="<?php echo date("m/d/Y"); ?>" style="position: relative; z-index: 10;" />
<input name="dateEnd" id="end" type="text" title="<?php echo date("m/d/Y"); ?>" style="position: relative; z-index: 10;" />

当我“按原样”使用它们时，我会在两个字段上都显示日历图标。

当我将以下代码（下方）附加到表单（它使用开始日期的值设置结束日期）时，开始日期的日历图标将消失。

即使使用我的附加代码，如何才能使日历图标保持稳定？

<script>
$('#start').datepicker({
 onSelect: function(dateText, inst) {
 $("#end").val(dateText);
}
});
</script>

Answer 1

好吧，我已经浏览了你在这里给出的代码并进行了一些修改：

$(document).ready(function() {
$('#start').datepicker({
 showOn: "button",
 buttonImage: "http://keith-wood.name/img/calendar.gif",
 buttonImageOnly: true , 
 onSelect: function(dateText, inst) {
 $("#start").val(dateText);
}
});

$('#end').datepicker({
 showOn: "button",
 buttonImage: "http://keith-wood.name/img/calendar.gif",
 buttonImageOnly: true , 
 onSelect: function(dateText, inst) {
 $("#end").val(dateText);
}
});
});

试试这个LIVE DEMO。

如果你想并排保留这两个字段，哟可以试试这个：http://jsfiddle.net/XXa7h/5/

编辑：好的，所以，下面的解决方案会在两个地方设置开始日期。

请参阅：http://jsfiddle.net/XXa7h/7/

你可以看到，我仍然保留了这条线：$("#end").val(dateText);没有注释。如果您不希望用户在End字段中选择日期，则只需注释掉或删除该行。希望这足够好！干杯！

如何在第一个字段上保留日历图标

1 个答案: