jQuery datepicker点击图标

我想在点击输入字段内的FontAwesome图标时显示jQuery datepicker。 以下是代码：

 Date of birth*    

 jQuery('.fa-calendar').on('click' , function() { jQuery(this).datepicker().trigger('focus'); }); 

Answer 1

试试这个

 $(document).ready(function() { $("#datepicker").datepicker(); $('.fa-calendar').click(function() { $("#datepicker").focus(); }); }); 

• 仅初始化datepicker一次

这是一个例子

 $(document).ready(function() { $("#datepicker").datepicker(); $('.fa-calendar').click(function() { $("#datepicker").focus(); }); }); 

      
 Date of birth*    

Answer 2

Answer 3

您想要在输入框上触发日期选择器，而不是图标，因此您需要更改

 jQuery(this).datepicker().trigger('focus');` 

成为

 jQuery("#datepicker").datepicker().trigger('focus'); 

Answer 4

您可以使用日期选择器上的'open'设置以编程方式打开它。 无需触发focus事件。 您还需要在#datepicker元素上调用#datepicker datepicker()方法，而不是单击的图标。 试试这个：

 jQuery(function($) { $('#datepicker').datepicker(); $('.fa-calendar').on('click', function() { $('#datepicker').datepicker('open'); }); }); 

Answer 5

HTML

 
 Date of birth*    

JS

 jQuery(".fa-calendar").datepicker(); 

这就是你想要做的。 它可以工作，您可以在输入类型中填写日期，如下所示。

 jQuery(".fa-calendar").datepicker().on('changeDate', function(ev){ jQuery("#datepicker_val").val(ev.date.valueOf()); } }); 

Answer 6

  $( function() { $( "#datepicker" ).datepicker({ showOn: "button", buttonImage: "images/calendar.gif", buttonImageOnly: true, buttonText: "icono", showOn: "both" }); } ); 

            
Date: