twitter-bootstrap 如何使用引导程序日期选择器
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/18519746/
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 to use bootstrap datepicker
提问by user2701687
Okay, So I'm new to using frameworks and js libraries and I'm wanting to us bootstrap and bootstrap datepicker for a form and I have no clue if I have the file order correct but the links is how the files are setup, and I know very little about javascript, pretty much all I code in is php but I need this for a form.
好的,所以我是使用框架和 js 库的新手,我想为表单使用 bootstrap 和 bootstrap datepicker,我不知道我的文件顺序是否正确,但链接是文件的设置方式,以及我对 javascript 知之甚少,几乎所有我编写的代码都是 php,但我需要这个作为表单。
Here's my testing form for the bootstrap datepicker:
这是我的 bootstrap datepicker 测试表单:
<!DOCTYPE html>
<html>
<head>
<title>Testing</title>
<meta charset="utf-8">
<link rel="stylesheet" href="_css/datepicker.css">
<link rel="stylesheet" href="_css/bootstrap.css">
<link rel="stylesheet" href="_css/bootstrap-responsive.css">
<script type="text/javascript" src="datepicker/bootstrap-datepicker.js"></script>
</head>
<body>
<center>
<h1>BootStrap Datepicker</h1>
<form>
<div class="well span12 main">
<input type="text" id="dp1" class="span2 datepicker" placeholder="Date..."
name="date"> <br>
</div>
<input type="submit" value="Search" class="btn">
</form>
</center>
<!-- JAVAscript ----------------------------------------------------------------->
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="_js/bootstrap-datepicker.js"></script>
<script type="text/javascript" src="_js/bootstrap.js"></script>
</body>
</html>
What exactly am I doing wrong?
我到底做错了什么?
回答by Teja Kantamneni
You should include bootstrap-datepicker.jsafter bootstrap.jsand you should bind the datepickerto your control.
您应该包括bootstrap-datepicker.jsafterbootstrap.js并且您应该将 绑定datepicker到您的控件。
$(function(){
$('.datepicker').datepicker({
format: 'mm-dd-yyyy'
});
});
回答by Colt Stumpf
I believe you have to reference bootstrap.js before bootstrap-datepicker.js
我相信你必须在 bootstrap-datepicker.js 之前引用 bootstrap.js
回答by JCO9
man you can use the basic Bootstrap Datepicker this way:
伙计,您可以通过这种方式使用基本的 Bootstrap Datepicker:
<!DOCTYPE html>
<head runat="server">
<title>Test Zone</title>
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"/>
<link rel="stylesheet" type="text/css" href="Css/datepicker.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="../Js/bootstrap-datepicker.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#pickyDate').datepicker({
format: "dd/mm/yyyy"
});
});
</script>
and inside body:
和身体内部:
<body>
<div id="testDIV">
<div class="container">
<div class="hero-unit">
<input type="text" placeholder="click to show datepicker" id="pickyDate"/>
</div>
</div>
</div>
datepicker.cssand bootstrap-datepicker.jsyou can download from hereon the Download button below "About" on the left side. Hope this help someone, greetings.
datepicker.css和bootstrap-datepicker.js你可以从这里下载左侧“关于”下方的下载按钮。希望这对某人有帮助,问候。
回答by Fahad Shakeel
Just add this below JS file
只需在 JS 文件下面添加这个
<script type="text/javascript">
$(document).ready(function () {
$('your input's id or class with # or .').datepicker({
format: "dd/mm/yyyy"
});
});
</script>

