Sib*_*cis 4 datepicker materialize material-design
我materializecss在我的网络应用程序中第一次使用,我正在努力使用datepicker.它根本不起作用.
我导入了materialize.css和js文件并使用了代码
<div>
<input type="date" class="datepicker" />
</div>
并添加了脚本代码
$(document).ready(function() {
$('select').material_select();
window.picker = $('.datepicker').pickadate({
selectYears: 16, // Creates a dropdown of 15 years to control year
format: 'yyyy-mm-dd'
});
});
但没有任何效果,它显示一个禁用的文本框.
另外我想知道如何添加timepicker materializecss？
小智 5
首先要知道，您需要检查Materialize CSS和javascript版本，也不要忘记检查jquery版本并在自定义init javascript中使用初始化代码。
检查init.js中的代码以进行初始化，以及通过CDN实现CSS和JS Materialize
$(document).ready(function() {
$('.modal').modal();
//this are my init
$('.datepicker').datepicker();
});<html>
<head>
<!-- this is my CSS via cdn -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-beta/css/materialize.min.css">
</head>
<body>
<div class="row">
<form class="col s12 m6 card">
<div class="row center">
<h4>Materialize DateTime Picker</h4>
<div class="input-field col s12 m12">
<input id="dtp" type="text" class="datepicker">
<label for="dtp">Birthday</label>
</div>
</div>
</form>
</div>
<!-- this is my JS via cdn -->
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0-beta/js/materialize.min.js"></script>
</body>
</html>查看Materialize网站上的文档，它对像我这样的程序员总是有帮助的。希望这个答案对您有帮助
尝试运行我的代码段
| 归档时间： |
|
| 查看次数： |
10138 次 |
| 最近记录： |