2014-12-02 69 views
5

我试图以编程方式触发下拉框类型为date的输入组件(日历位)(类似于单击输入字段上的向下箭头)。这可能吗?我不想使用日期选择器库。HTML5输入日期类型jQuery触发器

HTML:

<input type="date" id="myDatePicker"> 
<button id="myButton">Click Me</button> 

的JavaScript/jQuery的:

$('#myButton').click(function(){ 
    //$('#myDatePicker').click();//Doesn't do anything... 
    //$('#myDatePicker').blur();//Doesn't do anything... 
    //$('#myDatePicker').change();//Doesn't do anything... 
    //$('#myDatePicker').focus();//Doesn't do anything... 
}); 

http://jsfiddle.net/joepegler/mvobkjcu/8/

+2

相关:[使用Javascript]触发选择表单元素以显示其选项(打开下拉选项列表)(http://stackoverflow.com/questions/3846735/trigger-a-select-form-element-to- show-its-options-open-drop-down-options-list) – 2014-12-02 13:22:59

+0

http://jsfiddle.net/mvobkjcu/13/ – Hackerman 2014-12-02 13:23:15

+1

基本上根据这个问题你不能在没有插件或复杂的情况下实现这一点解决方法。 – 2014-12-02 13:24:07

回答

4

长话短说这样看来,你不能。我用日期选择器代替。

-3

尝试

$('#myDatePicker').focus(); 

应触发它。

+0

它不会触发它。 – 2015-06-18 10:26:18

-1

检查了这一点,(实现了这个插件使用)

http://jsfiddle.net/pandiyancool/v6zpbmao/

$(document).ready(function() { 
      $("#myDatePicker").datepicker({ 
       showOn: 'button', 
       buttonText: 'Click me', 
       dateFormat: 'dd/mm/yy', 
       constrainInput: true 
      }); 

      $(".ui-datepicker-trigger").mouseover(function() { 
       $(this).css('cursor', 'pointer'); 
      }); 

     }); 
+5

根据OP:_“我不想使用日期选择器库...”_ – War10ck 2014-12-02 13:43:51