explicitly force display of jquery datepicker calendar

人盡茶涼 提交于 2020-01-05 18:11:42

问题


I have a textbox linked to a JQuery datepicker which Chrome is unhelpfully pre-populating with the user's name.. I have autocomplete="off" in the field, but this has no effect as per

Chrome ignores autocomplete="off"

Clearly Chrome's behaviour is a long-running problem for developers, and it isn't clear to me what the present position is. One of the solutions was titled "Modern approach", but that was four years ago. However, I liked how it tackled the problem

<input type="text" onfocus="this.removeAttribute('readonly');" readonly />

as it didn't require superfluous fields, and it looked like it might withstand the next move that the designers of Chrome make to ensure form creators don't have control of their own forms. (I refer to the comment from mindplay.dk in Disabling Chrome Autofill)

However, although this workaround is successful in preventing autocompletion, it kills the pop-up of the datepicker calendar when the user clicks on the field, presumably because I have defined an explicit onfocus event. I figure I just need to add displaying the calendar explicitly to the onfocus code - if I knew how? Something like this I guess..

onfocus="this.removeAttribute('readonly'); this.JQuery.showPicker();"

Also quite happy to accept an answer that says "there's now a better, future-proofed way of doing this.."


回答1:


According to the official documentation you should use datepicker('show') method to achieve your goal. I've prepared sample fiddle for you.

const selector = '#datepicker';
$(selector).datepicker(); // init datepicker

$(selector).on('focus', function() {
  $(this).datepicker("show");
});


来源:https://stackoverflow.com/questions/57884127/explicitly-force-display-of-jquery-datepicker-calendar

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!