如何使日期选择器可见？答案

【问题标题】：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 库。可能会发生冲突。您是否在控制台中看到任何错误或警报？我还建议参加巡回赛：stackoverflow.com/tour

标签： jquery jquery-ui datepicker jquery-ui-datepicker

【解决方案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 无法按预期工作，然后从那里进行调查。

希望对您有所帮助。

【讨论】：