2014-12-02 71 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