我第一次在我的网络应用程序中使用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'
});
});
但没有任何效果,它会显示一个禁用的文本框。
另外,我想了解如何在materializecss
中添加时间戳?
答案 0 :(得分:8)
我遇到了同样的问题。将jquery降级到2.1.4解决了我的问题。看来,由于某种原因,datetimepicker和jquery 2.2.1不能一起工作。
欢呼声 托马斯
答案 1 :(得分:3)
首先要知道,您需要检查Materialise css和javascript版本的版本,也不要忘记检查jquery版本并使用自定义初始化javascript中的初始化代码。
检查我在init.js中的代码进行初始化,CSS和JS通过cdn实现物化
$(document).ready(function() {
$('.modal').modal();
//this are my init
$('.datepicker').datepicker();
});
&#13;
<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>
&#13;
查看https://developers.facebook.com/bugs/146171089525966/网站上的文档,这对像我这样的程序员来说总是有帮助的。 希望这个答案可以帮助你
尝试运行我的代码段
答案 2 :(得分:2)
<div class="row">
<div class="input-field col s12">
<input id="idate" type="text" name="idate" class="datepicker" >
<label for="idate">Issue Date</label>
</div>
</div>
$('.datepicker').pickadate({
selectMonths: true,// Creates a dropdown to control month
selectYears: 15 // Creates a dropdown of 15 years to control year,
});