我如何在已经使用引导库的同时添加 jquery ui 日期选择器?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/15934063/
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
How do i add jquery ui date picker, while already working with bootstrap library?
提问by XT_Nova
I'm playing around with bootstrap and i was going to add a datepicker to the page using it, but without any success.. So i found the code for a datepicker, using query ui: Datepicker
我正在玩引导程序,我打算使用它向页面添加一个日期选择器,但没有任何成功..所以我找到了日期选择器的代码,使用查询 ui: Datepicker
And tried this in a new html page, and it worked like a charm. However, i now want to use this in the page i was working on, but it seems like there are some conflicts between the different scripts and css files. Is there a way to solve this?
并在一个新的 html 页面中尝试了这个,它就像一个魅力。但是,我现在想在我正在处理的页面中使用它,但似乎不同的脚本和 css 文件之间存在一些冲突。有没有办法解决这个问题?
(i have delated the content of the page but left the scripts and links i'm importing)
(我已经删除了页面的内容,但留下了我正在导入的脚本和链接)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Svensk Bridge</title>
<link rel="stylesheet" type="text/css" href="../css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="../css/bootstrap-responsive.css">
</head>
<body>
<p>Date: <input type="text" id="datepicker" /></p>
<script type="text/javascript" src="../js/jquery.js"></script>
<script type="text/javascript" src="../js/bootstrap.js"></script>
<script type="text/javascript" src="../js/list-function.js"></script>
</body>
</html>
If i were to import all the files for the jquery ui for the date picker, it won't work.
如果我要为日期选择器导入 jquery ui 的所有文件,它将不起作用。
<html lang="en">
<head>
<meta charset="utf-8" />
<title>jQuery UI Datepicker - Default functionality</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css" />
<script>
$(function() {
$( "#datepicker" ).datepicker();
});
</script>
</head>
<body>
<p>Date: <input type="text" id="datepicker" /></p>
</body>
</html>
So, to sum up: Can i implement the jquery ui datepicker into my already existing document? And which scripts and links get prioritized?
所以,总结一下:我可以将 jquery ui datepicker 实现到我已经存在的文档中吗?哪些脚本和链接被优先考虑?
Regards, Bill
问候, 比尔
回答by Samuel Robert
I am using Bootstrap with Jquery UI datepicker, the problem must be the order in which you import things. Here my order:
我正在将 Bootstrap 与 Jquery UI datepicker 一起使用,问题一定是您导入内容的顺序。这是我的订单:
<script type="text/javascript" src="js/jquery-1.8.3.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.10.2.custom.js"></script>
<script type="text/javascript" src="js/bootstrap.js"></script>
<link type="text/css" href="css/jquery-ui-1.10.2.custom.css" rel="stylesheet" />
<link type="text/css" href="css/bootstrap.css" rel="stylesheet" />
回答by CBarr
You could, but my personal preference would be to add a Bootstrap-style datepicker instead. I've been using this one and it's pretty great. http://www.eyecon.ro/bootstrap-datepicker/
你可以,但我个人的偏好是添加一个 Bootstrap 风格的日期选择器。我一直在使用这个,它非常棒。http://www.eyecon.ro/bootstrap-datepicker/
The advantage here is that you don't actually need to include the jQuery UI library for this.
这里的优点是您实际上不需要为此包含 jQuery UI 库。