Javascript 我可以从函数中触发日期(时间)选择器吗?

Javascript 我可以从函数中触发日期(时间)选择器吗?,javascript,jquery-ui,jquery-plugins,Javascript,Jquery Ui,Jquery Plugins,我有一个包含20个选项的选择,当用户仅选择一个特定选项“选择日期时间”时,应显示日期(时间)选择器,然后在输入框中填充日期时间文本 可能吗?我该怎么做 我现在正在工作。它由按钮触发并链接到输入框。但我想根据我的具体需要修改它目前的工作方式 问题1:我知道如何在更改select时启动函数。然后我过滤选项,如果它是一个我会以某种方式开始日期选择器。我不知道怎么做这部分 问题2:我不知道如何告诉日期选择器将日期文本添加到现有文本框中。也许我可以把日期计时器选择器和文本框链接起来 jquery-1.7

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

可能吗?我该怎么做

我现在正在工作。它由按钮触发并链接到输入框。但我想根据我的具体需要修改它目前的工作方式

问题1:我知道如何在更改select时启动函数。然后我过滤选项,如果它是一个我会以某种方式开始日期选择器。我不知道怎么做这部分

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

  • jquery-1.7.2.min.js
  • jquery-ui-1.8.21.custom.min.js
  • jquery-ui-timepicker-addon.js
更新 在“我有选择”和文本框中。该按钮由日期/时间选择器创建

我想要的是:

  • 当用户选择/单击“选择日期和时间”选项时,将出现日期/时间选择器,文本将显示在文本框中
  • 我不希望按钮在页面上可见
  • 我将文本框用于其他目的,而不仅仅用于日期/时间,因此与此文本框相关的任何用户操作都无法显示日期/时间选择器
示例中的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>
$('#datetime').datetimepicker({
    showOn: "button"
});​
​注意:如上所述的最终工作版本:

尝试以下操作:

$('#datetime').datetimepicker();
$('option[value=datetimepicker]').click(function() {
    $('#datetime').datetimepicker('show');
});​
为了回答您的核心问题,datetimepicker插件是datepicker jQueryUI小部件的扩展,可以访问它的所有方法,包括show方法。因此,您可以在需要时以编程方式调用show以打开选择器


以相反顺序回答您的问题

日期选择器通常“附加”到输入框。无需告诉datepicker将其所选日期放入输入框。datepicker只是在关闭时执行此操作,即用户选择日期时

这就剩下了如何根据一些外部事件打开日期选择器的技巧。通常,只要在附加的输入框中单击,日期选择器就会自动打开。您希望通过更改选择/下拉列表自动打开它

这对我很有用:

js:

html:



你好 你好 布昂·乔诺 古滕标签
请发布您的代码。JSFIDLE也会很有帮助。JSFIDLE和示例代码添加感谢您的解释和解决方案。效果很好,但是如果单击文本框,选择器也会出现。不应该。所以把电话从按钮上拿开。
$(document).ready(function() {
  var $dp = $('#date1').datepicker({});

  $('#select1').change(function() {
      // programmatically open the datepicker
      $dp.datepicker('show'); 
  });
});
<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>