jQuery 如何在文本框中显示日历单击 html

how to show calendar on text box click in html

提问by Vinoth

In html i want to show calendarto select date while clicking a text box.then we select a date from that calendar then the selecteddate will be display in thattext box.

在 html 中，我想在单击文本框时显示日历以选择日期。然后我们从该日历中选择一个日期，然后所选日期将显示在该文本框中。

回答by Silviu Burcea

Starting with HTML5, <input type="date" />will do just fine.

从 HTML5 开始，<input type="date" />就可以了。

Demo: http://jsfiddle.net/8N6KH/

演示：http: //jsfiddle.net/8N6KH/

回答by pai.not.pi

You should read-up on jQueryUI Datepicker

你应该阅读jQueryUI Datepicker

Once you include the relevant jQuery UI library, it's as simple as,

一旦你包含了相关的 jQuery UI 库，它就像，

Script:

脚本：

$(function() {
    $( "#datepicker" ).datepicker();
});

HTML:

HTML：

<input type="text" id="datepicker" />

Pros:

优点：

• it is thoroughly tested for x-browser compatibility, so you won't have a problem.
• Separate css file, so you can customize it as per your liking

• 它针对 x 浏览器的兼容性进行了全面测试，因此您不会遇到任何问题。
• 单独的 css 文件，因此您可以根据自己的喜好对其进行自定义

回答by D.clixer

try to use jquery-ui

尝试使用 jquery-ui

<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>

<script>   
    $(function() {
         $( "#calendar" ).datepicker();   
    }); 
</script>

<p>Calendar: <input type="text" id="calendar" /></p>

more

更多的

回答by Victor

What you need is a jQuery UI Datepicker

你需要的是一个jQuery UI Datepicker

Check out the demoand the source code.

查看演示和源代码。

回答by Maulik Vora

You will need to use any javascript html calendar widget.

您将需要使用任何 javascript html 日历小部件。

try this calendar view widget, just copy-paste some code shown in example there and thats it what you want.

试试这个日历视图小部件，只需复制粘贴一些示例中显示的代码，这就是你想要的。

Here is the link to Jquery Mobile date box - JQM datebox

这是 Jquery Mobile 日期框的链接 - JQM日期框

回答by ajitksharma

yeah you will come across of various issues using HTML5 datepicker, it would work with some or might not be. I faced the same issue. Please check this DatePicker Demo, I solved my problem with this plugin. Its very good and flexible datepicker plugin with complete demo. It is completely compatible with mobile browsers too and can be integrated with jquery mobile too.

是的，您会在使用 HTML5 日期选择器时遇到各种问题，它可能适用于某些问题，也可能不适用于。我遇到了同样的问题。请检查这个DatePicker Demo，我用这个插件解决了我的问题。它非常好和灵活的日期选择器插件与完整的演示。它也与移动浏览器完全兼容，也可以与 jquery mobile 集成。

回答by nikinup

HTML Date Picker You can refer this.

HTML 日期选择器你可以参考这个。

回答by Starx

jQuery Mobile has a datepicker too. Source

jQuery Mobile 也有一个日期选择器。来源

Just include the following files,

只需包含以下文件，

  <script src="jQuery.ui.datepicker.js"></script>
  <script src="jquery.ui.datepicker.mobile.js"></script>