更新

Question

我有一个包含20个选项的选项，当用户仅选择一个特定选项“选择日期时间”时，应显示日期（时间）选择器，然后然后填写日期时间文本输入框。

这可能吗？我怎么能这样做？

我现在正在使用日期（选择器）。它由按钮触发并链接到输入框。但我想根据我的具体需要修改它的工作方式。

问题1：我知道如何在select的更改上触发函数。然后我过滤选项，如果它是我将以某种方式开始日期选择器。我不知道该怎么做。

问题2：我不知道如何告诉日期选择器将日期文本添加到现有文本框中。也许我可以用某种方式将日期计时器选择器与文本框链接起来。

的jquery-1.7.2.min.js
的jquery-UI-1.8.21.custom.min.js
的jquery-UI-timepicker-addon.js

更新

在jsfiddle sample我有选择和文本框。该按钮由日期/时间选择器创建。

我想要的是：

当用户选择/点击“选择日期和时间”选项时，日期/时间选择器将出现，文本将显示在文本框中
我不希望按钮在页面上可见
我将文本框用于其他目的，不仅用于日期/时间，因此任何与此文本框相关的用户操作都无法显示日期/时间选择器

示例中的html代码

<input id="datetime" type="text" name="datetime" value="" >
<select size=5>
    <option value="not">Not this one</option>
    <option value="not">Not this one</option>
    <option value="not">Not this one</option>
    <option value="datetimepicker">Select date and time</option>
</select>

示例中的javascript代码

$('#datetime').datetimepicker({
    showOn: "button"
});

注意：如上所述的最终工作版本：http://jsfiddle.net/radek/dPRjS/8/

Answer 1

你去吧。看看这个jsfiddle演示。

here's the fiddle

随意重新考虑代码以改进它。

Answer 2

试试这个：

$('#datetime').datetimepicker();
$('option[value=datetimepicker]').click(function() {
    $('#datetime').datetimepicker('show');
});

要回答您的核心问题，datetimepicker插件是datepicker jQueryUI小部件的扩展，可以访问其所有方法，包括show方法。因此，您可以以编程方式调用节目，以便在需要时打开选择器。

<强> jsFiddle example

Answer 3

以相反的顺序回答你的问题......

Datepicker通常“附加”到输入框。没有必要告诉datepicker将其选定的日期放入输入框。日期选择器只在关闭时执行此操作，即用户选择日期时。

这留下了如何基于某些外部事件打开日期选择器的技巧。通常，只需在附加的输入框中单击即可自动打开日期选择器。您希望通过更改选择/下拉列表自动打开它。

这对我有用：

JS：

$(document).ready(function() {
  var $dp = $('#date1').datepicker({});

  $('#select1').change(function() {
      // programmatically open the datepicker
      $dp.datepicker('show'); 
  });
});

HTML：

<input type="text" id="date1" size="12">
<br/>
<select id="select1">
  <option>Hello</option>
  <option>Bonjour</option>
  <option>Buon giorno</option>
  <option>Guten tag</option>
</select>

我可以从函数中触发日期（时间）选择器吗？

更新

3 个答案: