如何制作自定义jquery日历...............？

Question

我在我的网页上有一个显示日期的文本字段。其中还包括框旁边的日历图标。现在，当我点击图标时，日历应该在文本字段下弹出。然后，当我点击一个日期时，它应该选择一个日期，当我选择第二个日期，它应该选择一个范围，并输入范围到文本框。当我双击任何一个日期，那个日期只被选中。当一个范围被选中，那么日历上的范围应该从第一个日期开始标记为红线，并在第二个日期结束。我怎样才能做到这一点？

这是我的文本字段：

Date: <input type="text" id="datepickerr" value="2016-08-26"></p> 
<img src="CalendarIcon.png" id="cal"> 

Answer 1

试试这个

daterangepicker

其使用

<input type="text" name="daterange" value="01/01/2015 - 01/31/2015" /> 

<script type="text/javascript"> 
$(function() { 
    $('input[name="daterange"]').daterangepicker(); 
}); 
</script>