Question

我有两个拣选选项 1）点击图片 2）点击输入框

假设输入框日期是16-05-2014，现在点击一个图像我打开一个日期选择器，我需要限制用户选择旧日期，

喜欢到15-05-2014天，我需要禁用。

$(function() {
    $("#travel_date").datepicker({
      dateFormat: "dd-mm-yy",
      changeYear: true,
      changeMonth: true,
      numberOfMonths:[1,2],
      minDate: new Date(),
      onClose: function( selectedDate ) {
        $( "#return_on" ).datepicker( "option", "minDate", selectedDate );
      }
    }).attr('readonly','readonly');
    if($("#travel_date").val() == ""){
      $("#travel_date").val($.datepicker.formatDate("dd-mm-yy", new Date()));
    }
 $("#return_date").datepicker({
    buttonImage: "/assetsweb/plus.png",
    buttonImageOnly: true,
    //title: true,
    changeMonth: true,
    changeYear: true,
    showOn: 'both',
    dateFormat: "dd-mm-yy",
    setDate: new Date(),
    numberOfMonths:[1,2],
    minDate: new Date(),
    onSelect: function(dateText) {
     $('#return_on').val(dateText); 
     $('#modify_search_form').submit();
     // $("#return_date").datepicker("option","tDate", selected)
    }
  });
});

在输入框中，日期将从上一页中选择，现在如果我点击图像，简单的日期选择器即将到来而没有禁用日期。

Answer 1

如果我理解正确，初始日期将来自上一页。

你能做的是：

使用datepicker显示该日期，但请将其禁用，以便用户不会意外更改它。
使用图片按钮将datepicker连接到第二个日期输入。
将minDate指定为第一个日期输入的datepicker返回的日期。

HTML示例：

<!-- This input holds the date coming from previous page -->
<input id="oldDate" value="2014-05-16" disabled="disabled" />


<!-- This input holds the new date which is selected by user -->
<input id="newDate" />

JQuery代码示例：

// Attach datepicker to the input which holds the date from previous page
$("#oldDate").datepicker({ dateFormat: "yy-mm-dd" });

// Attach datepicker to the second date input
$("#newDate").datepicker({
    showOn: "button",
    buttonImage: "... your image...",
    buttonImageOnly: true,
    dateFormat: "yy-mm-dd",
    minDate: $("#oldDate").datepicker("getDate") // set it to date returned by first dp
});

演示：http://jsfiddle.net/abhitalks/D69e9/

希望这足以为你提供一些如何实现这一目标的方向。

如何限制用户从Jquery中的两个日期选择器中选择日期？

1 个答案: