Question

我正面临一个问题。我只需要在单击图标时显示jquery datepicker。我在下面解释我的代码。

<input type="text" class="inputType2" id="car_d_date" value="">
<span class="globalcolor" id="calicon">
  <i class="icon-calendar-7"></i>
</span>

$(function(){
  $("#car_d_date").datepicker();
  $("#calicon").click(function(){
    $("#car_d_date").datepicker('show');
  })
})

在我的情况下，也在输入字段中单击显示日历。在这里，我需要用户单击日历图标，然后显示日历并在文本框中查看所选日期。

Answer 1

您可以将datepicker的showOn属性的值设置为空。

$("#car_d_date").datepicker({
  showOn: ''
});
$("#calicon").click(function(){
  $("#car_d_date").datepicker('show');
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">

<input type="text" class="inputType2" id="car_d_date" value="">
<span class="globalcolor" id="calicon">
  <i class="icon-calendar-7">icon</i>
</span>

如何仅使用Jquery在图标单击上显示日期选择器？

1 个答案: