JQuery 日期选择器不起作用

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5687942/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 19:39:10  来源:igfitidea点击:

JQuery datepicker not working

jqueryjquery-uijquery-ui-datepicker

提问by newbie

Good day!

再会!

I am trying to use jquery for the first time. And i cannot make it work. My code is as follows:

我第一次尝试使用 jquery。我不能让它工作。我的代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<link rel="stylesheet" type="text/css" href="style.css" media="screen" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
</head>
<body>
<script>
    $(function() {
        $( "#datepicker" ).datepicker();
    });
    </script>
    <div class="demo">
    <p>Date: <input type="text" id="datepicker"></p>
    </div><!-- End demo -->
</body>
</HTML>

But the datepicker is not working.. What should i do to make it work? Thank you.

但是日期选择器不起作用..我应该怎么做才能使它工作?谢谢你。

回答by Raynos

You did not include the datepicker library

您没有包含日期​​选择器库

so add

所以添加

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/jquery-ui.min.js"></script>

to your <head>tag

到你的<head>标签

live demo

现场演示

回答by Peter Olson

Datepicker is not part of jQuery. You have to get jQuery UIto use the datepicker.

Datepicker 不是 jQuery 的一部分。您必须获得jQuery UI才能使用日期选择器。

回答by Jared Farrish

The problem is you are not linking to the jQuery UI library (which is where datepicker resides):

问题是您没有链接到 jQuery UI 库(日期选择器所在的位置):

http://jsfiddle.net/5AkyC/

http://jsfiddle.net/5AkyC/

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<link rel="stylesheet" type="text/css" href="style.css" media="screen" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.js"></script>
<script>
$(function() {
    $( "#datepicker" ).datepicker();
});
</script>
</head>
<body>
    <div class="demo">
    <p>Date: <input type="text" id="datepicker"></p>
    </div><!-- End demo -->
</body>
</HTML>

回答by Mike Gostomski

I was stuck on an issue where datepicker() appeared to be doing nothing. It turned out that the issue was that the input was inside a Bootstrap "input-group" div. Simply taking the input out of the input-group resolved the issue.

我被困在 datepicker() 似乎什么都不做的问题上。事实证明,问题在于输入位于 Bootstrap“输入组”div 内。只需将输入从输入组中取出即可解决问题。

回答by bcm

For me.. the problem was that the anchor needs a title, and that was missing!

对我来说..问题是主播需要一个标题,而这个标题不见了!

回答by Ambala Chandrashekar

after that all html we want to write these lines of code

之后所有的html我们要写这些代码行

<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/jquery-ui.min.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/themes/base/jquery-ui.css" type="text/css" media="all">



<script>
$('#date').datepicker({
    changeMonth: true,
    changeYear: true,
    showButtonPanel: true,
    yearRange: "-100:+0",
    dateFormat: 'dd/mm/yy'

});
</script>

回答by Mohd Abdul Mujib

If jQuery UI datepicker isn't working but it used to work on similar DOM earlier, try removing all the classes and try binding it to just a simple input with its id. In my case a class was interfering with it and preventing the date picker to appear.

如果 jQuery UI datepicker 不工作,但它以前可以在类似的 DOM 上工作,请尝试删除所有类并尝试将其绑定到仅具有其 id 的简单输入。在我的情况下,一个类正在干扰它并阻止日期选择器出现。

回答by Michael Jasper

try adjusting the order in which your script runs. Place the script tag below the element it is trying to affect. Or leave it up at the top and wrap it in a $(document).ready()EDIT: and include the right file.

尝试调整脚本运行的顺序。将脚本标签放在它试图影响的元素下方。或者将其留在顶部并将其包装在$(document).ready()EDIT: 中并包含正确的文件。