展开输入日期日历（浏览器原生）

Question

是否可以扩展原生浏览器日历..

<input id="calendar" type="date"></input>

..就像你实际点击它一样？

我尝试模拟点击事件：

$('#calendar').trigger('click');

但没有运气。想法？ Fiddle here

PS：我不对jquery datepicker等插件感兴趣。谢谢

Answer 1

无需触发任何事件来显示Native DatePicker / TimePicker。 如果浏览器支持HTML5输入类型的日期/时间，那么它将打开本机DatePicker / TimePicker。 请检查此example

Answer 2

可能你可以使用这个黑客 -

http://jsfiddle.net/f4tmz4td/

HTML

<input id="calendar" type="date"></input>
<input class="button" type="button" value="Click"/>

CSS

#calendar {
  position: absolute;
  opacity: 0;
  right: 15px;
}

.button{
  float: right;
}

使用CSS将datepicker放在btn上方。使用Opacity：0隐藏日期选择器，以便用户可以看到您的按钮。