2

我有一个包含 20 个选项的选择,当用户仅选择一个特定选项“选择日期时间”时,应出现日期(时间)选择器,然后在输入框中填充日期时间文本

那可能吗?我怎样才能做到这一点?

我现在有日期(选择器)工作。它由按钮触发并链接到输入框。但我想根据我的特定需求修改它目前的工作方式。

问题1:我知道如何在选择更改时触发函数。然后我过滤选项,如果它是我将以某种方式启动日期选择器的选项。我不知道如何做这部分。

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

  • jquery-1.7.2.min.js
  • jquery-ui-1.8.21.custom.min.js
  • jquery-ui-timepicker-addon.js

更新

jsfiddle 示例中,我有选择和文本框。该按钮由日期/时间选择器创建。

我想要的是:

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

示例中的 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/

4

2 回答 2

1

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

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>
于 2012-06-15T03:41:23.107 回答
1

尝试这个:

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

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

jsFiddle 示例

于 2012-06-15T03:40:36.137 回答