通过单击链接打开日期选择器

Question

我在我的网页上使用JQuery UI的Datepicker。目前，我已经成功地使它与一个名为“mydate”的文本框一起工作。代码如下：

$('#releasedate').datepicker({ 
       changeYear: 'true', 
       changeMonth:'true', 
       startDate: '07/16/1989', 
       firstDay: 1 
      }); 

但是，我想要一个小的改变。我想显示一个名为“选择日期”的链接，而不是文本字段，该链接应打开日期选择器，并且在选择日期时，需要更新隐藏文本字段的值。

我尝试了不同的方式来做到这一点，但一直不成功。 JQuery专家，你可以帮我吗？我急切地希望得到解决方案。非常感谢你提前。

Answer 1

实际上，你可以只附上日期选择到<input type="hidden" />，使链接触发打开它：

$(function() { 
 
    $('#hiddenDate').datepicker({ 
 
     changeYear: 'true', 
 
     changeMonth: 'true', 
 
     startDate: '07/16/1989', 
 
     firstDay: 1 
 
    }); 
 
    $('#pickDate').click(function (e) { 
 
     $('#hiddenDate').datepicker("show"); 
 
     e.preventDefault(); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.0/themes/smoothness/jquery-ui.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.0/jquery-ui.min.js"></script> 
 

 
<input id="hiddenDate" type="hidden" /> 
 
<a href="#" id="pickDate">Select Date</a>

Answer 2

试试这个：

$('#datepicker').datepicker('hide'); 
$('a').click(function() { 
    $('#datepicker').datepicker('destroy'); 
    $('#datepicker').datepicker({ 
     altField: '#shhh', 
     changeYear: 'true', 
     changeMonth: 'true', 
     firstDay: 1, 
     onSelect: function() { 
      $('#datepicker').datepicker('destroy'); 
     } 
    }) 
}); 

jsFiddle example