如何使日期选择器可见?
Posted
技术标签:
【中文标题】如何使日期选择器可见?【英文标题】:How can i make the datepicker be visible? 【发布时间】:2019-10-15 17:03:17 【问题描述】:我希望日期选择器在我单击时可见并且可以工作。这是我的代码,我不知道为什么它不起作用
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Language" content="ru">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>The title</title>
<link rel="stylesheet" type="text/css" media="print" href="css/print.css">
<link rel="stylesheet" type="text/css" href="css/jquery-ui.min.css">
<link rel="stylesheet" href="css/registration.css" type="text/css">
<link rel="stylesheet" href="materialize/materialize.min.css"/>
<link rel="stylesheet" href="css/style.css"/>
<link rel="stylesheet" href="materialize/icon.css" >
<script type="text/javascript" src="js/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="js/jquery-ui.min.js"></script>
<script>$.widget.bridge('uitooltip', $.ui.tooltip);</script>
<script src="materialize/materialize.min.js"></script>
<script type="text/javascript" src="js/jquery.cookie.js"></script>
<script type="text/javascript" src="js/main.js"></script>
<script type="text/javascript" src="js/menu.js"></script>
<script type="text/javascript" src="js/lang.js"></script>
<script type="text/javascript">
add_words(
"not_be_empty": "Поле не должно быть пустым!",
"filled_out_incorrectly": "Поле пустое или заполнено некорректно!"
);
</script><script type="text/javascript" src="js/jquery.ui.datepicker.js"></script><script type="text/javascript" src="js/jquery.inputmask.js"></script><script type="text/javascript" src="js/jquery.bind-first-0.1.min.js"></script><script type="text/javascript" src="js/phones_mask/jquery.inputmask-multi.js"></script><script type="text/javascript" src="js/registration.js"></script> </head>
<body>
<input type="text" name="birthday" value="" id="birthday" class="inputform" />
在我的registration.js中我有:
var params =
monthNames: ["Январь","Февраль","Март","Апрель","Май","Июнь","Июль","Август","Сентябрь","Октябрь","Ноябрь","Декабрь"],
monthNamesShort: ['Янв','Фев','Мар','Апр','Май','Июн','Июл','Авг','Сен','Окт','Ноя','Дек'],
dayNamesMin: ["Вс","Пн","Вт","Ср","Чт","Пт","Сб"],
dayNames: ["Воскресенье","Понедельник","Вторник","Среда","Четверг","Пятница","Суббота"],
dateFormat: "yy-mm-dd",
changeMonth: true,
changeYear: true,
yearRange: (year - 100) + ':' + year,
firstDay: 1
;
$("#birthday").datepicker(params).keypress(function(event) return false;);
因此,当我单击输入时,添加了“hasDatepicker”类,但日期选择器不显示。试图从“#birthday”中删除课程,但没有帮助
P。 S. 对不起我的英语
【问题讨论】:
P. S. 奇怪的东西。我注意到如果我开始不链接文件“js/jquery.ui.datepicker.js”它工作正常。但问题是我不知道它是否需要(js/jquery.ui.datepicker.js 文件) 用于其他 HTML 页面。有人可以建议另一种更好的方法来解决这个问题 刚刚找到文件链接的位置并注释该行。问题解决了。谢谢 欢迎来到 Stack Overflow。我注意到的第一件事是您添加了大量的 JS 库。可能会发生冲突。您是否在控制台中看到任何错误或警报?我还建议参加巡回赛:***.com/tour 【参考方案1】:我无法通过一个基本示例来复制该问题:
$(function()
var Now = new Date();
var year = Now.getFullYear();
var params =
monthNames: ["Январь", "Февраль", "Март", "Апрель", "Май", "Июнь", "Июль", "Август", "Сентябрь", "Октябрь", "Ноябрь", "Декабрь"],
monthNamesShort: ['Янв', 'Фев', 'Мар', 'Апр', 'Май', 'Июн', 'Июл', 'Авг', 'Сен', 'Окт', 'Ноя', 'Дек'],
dayNamesMin: ["Вс", "Пн", "Вт", "Ср", "Чт", "Пт", "Сб"],
dayNames: ["Воскресенье", "Понедельник", "Вторник", "Среда", "Четверг", "Пятница", "Суббота"],
dateFormat: "yy-mm-dd",
changeMonth: true,
changeYear: true,
yearRange: (year - 100) + ':' + year,
firstDay: 1
;
$("#birthday").datepicker(params).keypress(function(event)
return false;
);
);
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-3.2.1.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<p>Birthday: <input type="text" name="birthday" value="" id="birthday" class="inputform" /></p>
此代码按预期工作。我怀疑与以下其中一项存在冲突:
materialize/materialize.min.js js/jquery.cookie.js js/main.js js/menu.js js/lang.js js/jquery.ui.datepicker.js js/jquery.inputmask.js js/jquery.bind-first-0.1.min.js js/phones_mask/jquery.inputmask-multi.js js/registration.js我建议删除所有不需要的并一次添加一个,直到 DatePicker 无法按预期工作,然后从那里进行调查。
希望对您有所帮助。
【讨论】:
以上是关于如何使日期选择器可见?的主要内容,如果未能解决你的问题,请参考以下文章