单击链接时显示DatePicker？

我有一个链接，我想显示的日期选择器，当我点击它：单击链接时显示DatePicker？

$('body').on("click", ".date-link", function (e) { 
    /* 
    $("#daterange").dialog("option", "position", 
      { 
       my: "left top", 
       at: "left bottom", 
       of: e, 
      }); 

    $("#daterange").dialog('open'); 
    */ 

    $(e).datepicker({ 
     beforeShowDay: $.datepicker.noWeekends, 
     onSelect: function (dateText) { 
      changeCalendarDate(dateText); 
     }, 
     onClose: function (dateText) { 
     } 
    }); 

    $("#filter").dialog('close'); 
});

，除非用户选择一个日期，其中它将我也样子的自动关闭被点击任何文件元素时自动关闭。

感谢

来源

2013-03-08 jmasterx

在上面的代码中，您正试图在事件对象上调用['.datepicker（）']（http://jqueryui.com/datepicker）。应该在表示应该触发它的DOM元素（通常是输入）的jQuery对象上调用它。 – 2013-03-08 19:34:11

您可以设置您的日期选择器实例的点击处理程序之外。然后点击链接时，只需在设置日期选择器的元素上调用.datepicker('show')即可。

下面是一个简化的例子：

HTML

<input id="date" /> 
<a href="#" class="date-link">Date Link</a>

$("#date").datepicker({ 
    beforeShowDay: $.datepicker.noWeekends, 
    onSelect: function (dateText) { 
     changeCalendarDate(dateText); 
    } 
}); 

$('.date-link').on('click', function(e) { 
    // Do not follow link 
    e.preventDefault(); 
    // Show the datepicker 
    $('#date').datepicker('show'); 
}); 

function changeCalendarDate(dateText) { 
    // Process date 
    console.log(dateText); 
}

DEMO

来源

2013-03-08 19:30:06

单击链接时显示DatePicker？

回答

相关问题