日期选择器不工作。我找不到我在代码中遗漏了什么
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
<script src="js/bootstrap.min.js" type="text/javascript"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link href="http://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="js/bootstrap-datepicker.js" type="text/javascript"></script>
<script src="js/bootstrap-datepicker.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
$('#datePicker')
.datepicker({
format: 'mm/dd/yyyy'
})
.on('changeDate', function(e) {
// Revalidate the date field
$('#eventForm').formValidation('revalidateField', 'date');
});
$('#eventForm').formValidation({
framework: 'bootstrap',
icon: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
name: {
validators: {
notEmpty: {
message: 'The name is required'
}
}
},
date: {
validators: {
notEmpty: {
message: 'The date is required'
},
date: {
format: 'MM/DD/YYYY',
message: 'The date is not a valid'
}
}
}
}
});
});
</script>
<div class="form-group">
<div class="date">
<div class="input-group input-append date" id="datePicker">
<input type="text" class="form-control" name="date" />
<span class="input-group-addon add-on"><span class="glyphicon glyphicon-calendar"></span></span>
</div>
</div>
</div>
此代码显示#datepicker输入组件，但单击后，它不会打开。它也不能调用简单的$（“#日期选择器”）。日期选择器（）；方法请提供一些解决方案。
简单的datepicker（）方法带有自己的默认设置，但我在这个方法中进行了自己的自定义。
在div标签中，它是在body标签中定义的，但我已经使它简短。span标签用于嵌入带有日期选择器输入组件的图标。在这种情况下，我使用的是字形压光。但是在那之前，我告诉编译器，我要通过编写class="inport-group-addon add-on"来制作一个图标。
共有3个答案
它现在工作：
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" type="text/javascript"></script>
<link href="http://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js" type="text/javascript"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.0/js/bootstrap-datepicker.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
$('#datePicker')
.datepicker({
format: 'mm/dd/yyyy'
})
.on('changeDate', function(e) {
// Revalidate the date field
$('#eventForm').formValidation('revalidateField', 'date');
});
$('#eventForm').formValidation({
framework: 'bootstrap',
icon: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
name: {
validators: {
notEmpty: {
message: 'The name is required'
}
}
},
date: {
validators: {
notEmpty: {
message: 'The date is required'
},
date: {
format: 'MM/DD/YYYY',
message: 'The date is not a valid'
}
}
}
}
});
});
</script>
<div class="form-group">
<div class="date">
<div class="input-group input-append date" id="datePicker">
<input type="text" class="form-control" name="date" />
<span class="input-group-addon add-on"><span class="glyphicon glyphicon-calendar"></span></span>
</div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
<script src="js/bootstrap.min.js" type="text/javascript"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link href="http://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="js/bootstrap-datepicker.js" type="text/javascript"></script>
<script src="js/bootstrap-datepicker.min.js" type="text/javascript"></script>
load jquery.js first and than load all js because juery is requisite for all js.
独自创立js和jqueryui需要jquery。将jquery放在顶部。并删除多个引导脚本定义。
-
我试图在表中使用日期选取器添加和删除行。默认情况下，日期选取器不起作用。但是我点击了添加行按钮，它已经工作了。我找不到解决方案。 请参考小提琴位置。
-
我正在重构我们的一些组件，因此我尝试合并记忆，因为一些组件可能会使用相同的值重新呈现（例如，热链接图像URL，除非它们相同）。 我有一个简单的组件： 然后是阿凡达笠美： 我还试着传递备忘录的第二个论点： 但是console.log仍然每次都显示出来。我显然遗漏了什么，或者不太明白这是怎么回事。这个组件是几个级别下来，但它通过在img如果它是每次可用的，所以我希望它知道，如果img是通过在以前的渲染
-
此代码不起作用。我不知道我需要添加什么资源。下面是Datepicker的链接：http://jsfiddle.net/rMhVz/1030/ 我的代码在下面。我真的需要让它发挥作用。谢谢你的帮助。提前谢谢。
-
我找不到日期选择器的元素。我尝试了CssSelector和xpath等。下面是我试过的代码。 代码： 下面是HTML代码。 HTML: 这里是错误： 组织。openqa。硒。NoTouchElementException:无法定位元素：
-
嗨，我正在使用selenium尝试与我的iOS应用程序的日期选择器进行交互。然而，在appium inspector中，我无法看到xpath，甚至无法选择日期选择器与之交互。 我该如何与它互动。当我单击复制xml并将其粘贴到浏览器中时，我也不会在树中看到日期选择器。 编辑：添加在执行grid.driver（）.getPageSource（）时出现的xml行，而不是仅仅从appium复制xml...
-
问题内容： 我有这样的布局： 使用以下CSS规则： 我使用jQuery将类添加到没有其他类之一的扇区中，或者： 然后，我对该类应用一些不同的规则： 一切都可以在现代浏览器中完美运行。 但是看到jQuery中的选择器是基于CSS3的，我想我可以将其直接移到样式表中，这样我就不必依靠使用jQuery添加额外的类了。此外，我对支持IE的较旧版本并不感兴趣，其他浏览器也对选择器提供了出色的支持。 因此，我