如何通过代码在日期类型输入中打开窗口

Question

<span>{{t.date}}</span>
<input type='date' ng-model='t.date' id='tdate'/>

现在，当用户点击输入图标时，它会打开日期窗口，一切正常，但我希望用户能够单击跨度，并且还可以打开日期窗口。 在控制面板上几个小时后，我仍然没有找到打开输入的事件。

提前感谢您的帮助

Answer 1

正如斯利姆所说，你没有作为程序员的控制权。他是真的Read This

但是在某些情况下我们无法进行新的实施，因此对于这种情况，您可以使用CSS。您需要做的只是将css规则应用于您的输入，以覆盖您的span元素。使颜色和背景颜色透明，以便用户不会看到，但是当用户点击span时，实际上会执行输入日期点击。

希望它有效。

Answer 2

作为程序员，您无法控制html5 datepicker，因为它是一个浏览器特定的功能，而且这个日期选择器只出现在一些实际的浏览器中。

为什么不想使用输入字段？ 您可以使用css设置输入字段的样式，它看起来像一个span元素：

#tdate {
   border: none;
   display: inline;
}

jQuery UI

或使用你可以触发的jquery ui datepicker：https://jqueryui.com/datepicker/：

$('span').click(function () {
    $('#tdate').datepicker("show");
});

如果您在这种情况下想要隐藏输入字段，那么最终可以使用

input {
   height: 0;
   border: none;
}

UI Bootstrap

或使用angularJS https://angular-ui.github.io/bootstrap/#/datepicker 您可以使用属性打开此选择器，并更改此范围内的点击：is-open=true