如何在按钮单击时显示 jquery datepicker答案

【问题标题】：how to show a jquery datepicker on button click如何在按钮单击时显示 jquery datepicker
【发布时间】：2020-04-22 13:04:51
【问题描述】：

我只想在按钮点击时显示日期选择器

<input type="button" id=day value="day" />
$("#day").datepicker();

上面的行用所选日期填充按钮文本

我也尝试了下面的代码，但没有任何反应

$("#day").click(function() {
    $("#hiddenField").datepicker('show');
});

【问题讨论】：

标签： jquery jquery-ui

【解决方案1】：

您可以使用内置的showOn 函数来做到这一点：

$( "#hiddenField" ).datepicker({
    showOn: "button",
    buttonText: "day"
});

JSFiddle：http://jsfiddle.net/Uv8V4/

参考：http://jqueryui.com/datepicker/#icon-trigger

【讨论】：

【解决方案2】：

您可以将按钮作为触发器附加到 jQuery DatePicker，如下所述，

<script type="text/javascript>"
  $( function() {
      $( "#datepicker" ).datepicker({
          showOn: "button",
          buttonImage: "https://jqueryui.com/resources/demos/datepicker/images/calendar.gif",
          buttonImageOnly: true,
          buttonText: "Select date"
      });
    });
    </script>

点击以下链接查看有效的小提琴示例

https://jsfiddle.net/anjanasilva/rtt25a1m/

【讨论】：

【解决方案3】：

尝试以下：

$("#day").click(function() {
        $("#hiddenField").datepicker("show");
    });

单引号不起作用。

希望这会有所帮助。

【讨论】：

【解决方案4】：

试试看

$("#hiddenField").datepicker({
    showOn: 'button',
    buttonText: 'Choose Date',
    dateFormat: 'dd/mm/yy',
    constrainInput: true
});

在$(document).ready(function(){}); 函数中。

希望这会有所帮助。

【讨论】：

【解决方案5】：

您需要先为您的输入字段初始化日期选择器

$('#input_filed').datepicker();

那么你需要为按钮添加触发器

$('#button').click(function() {
      $('#input_filed').datepicker('show');
});

【讨论】：