未捕获的类型错误：jQuery(...).datetimepicker 不是函数

发布于 2025-01-18 13:40:55 字数 1776 浏览 3 评论 0原文

我有一个生成正常日期时间选择器的代码，但它向我抛出此错误 Uncaught TypeError: jQuery(...).datetimepicker is not a function

任何人都可以帮助我，我想是的因为链接和引导程序的安排，但我没有清晰的图片。

下面是我的代码

<html>
    <head>
     <link rel="stylesheet" href="jquery.datetimepicker.css">
    <script src="jquery-1.8.2.min.js"></script>
    <!-- <script src="jquery-ui.js"></script> -->
    <script src="https://code.jquery.com/ui/1.13.1/jquery-ui.js"></script>
    <script src="jquery.datetimepicker.js"></script>
    <script src="jquery.validate.min.js"></script>
    <link rel="stylesheet" href="fonts/icomoon/style.css">
    <link rel="stylesheet" href="css/owl.carousel.min.css">
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/style.css">


    <script>
        $(document).ready(function() {
            jQuery('#datevalue').datetimepicker();
            jQuery('#completed').datetimepicker();
        });
    </script>
    </head>

    <body>
        <form action="#" method="post">
            <div id="AlignMainDiv">
                <div class="form-group last mb-4">
                    <label for="date">Date</label>
                    <input type="text" class="form-control" id="datevalue">
                  </div>
                  <div class="form-group last mb-4">
                    <label for="username">Completed Date and Time</label>
                    <input type="text" class="form-control" id="completed">
                  </div>
            </div>
        </form>
    </body>
</html>

原文

I have a code to generate a normal date time picker, but it is throwing me this error Uncaught TypeError: jQuery(...).datetimepicker is not a function

Can anyone help me, i guess it is because of arrangment of links and bootstrap , but i don't have a clear picture of it.

below is my code

<html>
    <head>
     <link rel="stylesheet" href="jquery.datetimepicker.css">
    <script src="jquery-1.8.2.min.js"></script>
    <!-- <script src="jquery-ui.js"></script> -->
    <script src="https://code.jquery.com/ui/1.13.1/jquery-ui.js"></script>
    <script src="jquery.datetimepicker.js"></script>
    <script src="jquery.validate.min.js"></script>
    <link rel="stylesheet" href="fonts/icomoon/style.css">
    <link rel="stylesheet" href="css/owl.carousel.min.css">
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/style.css">


    <script>
        $(document).ready(function() {
            jQuery('#datevalue').datetimepicker();
            jQuery('#completed').datetimepicker();
        });
    </script>
    </head>

    <body>
        <form action="#" method="post">
            <div id="AlignMainDiv">
                <div class="form-group last mb-4">
                    <label for="date">Date</label>
                    <input type="text" class="form-control" id="datevalue">
                  </div>
                  <div class="form-group last mb-4">
                    <label for="username">Completed Date and Time</label>
                    <input type="text" class="form-control" id="completed">
                  </div>
            </div>
        </form>
    </body>
</html>

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

奈何桥上唱咆哮 2025-01-25 13:40:55

按F11，打开Chrome调试，转到Network＆gt; JS选项卡并检查随附的JS库是否返回404状态。也许您拼错了脚本名称或URL路径。

您也可以尝试直接从CDN中包含库：

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>jQuery UI Datepicker - Default functionality</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.13.1/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script src="https://code.jquery.com/jquery-3.6.0.js"></script>
  <script src="https://code.jquery.com/ui/1.13.1/jquery-ui.js"></script>
  <script>
  $( function() {
    $('#datevalue').datetimepicker();
    $('#completed').datetimepicker();
  } );
  </script>
</head>

Press F11, open the Chrome debug, go to Network > JS tab and check if any of the included js libraries return a 404 status. Maybe you misspelled a script name or URL path.

You can also try to include the libraries directly from CDNs:

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>jQuery UI Datepicker - Default functionality</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.13.1/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script src="https://code.jquery.com/jquery-3.6.0.js"></script>
  <script src="https://code.jquery.com/ui/1.13.1/jquery-ui.js"></script>
  <script>
  $( function() {
    $('#datevalue').datetimepicker();
    $('#completed').datetimepicker();
  } );
  </script>
</head>

回复收藏 0 原文

故事还在继续 2025-01-25 13:40:55

我不知道您的DateTimePicker库是否正在加载。

您可以使用以下CDN。

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.4/build/jquery.datetimepicker.full.min.js"></script>

以下代码将加载今天的日期，并将在输入单击时显示datepicker

<script>

    $(document).on("click", "#datevalue" , function() {

        $(this).datetimepicker({
            timepicker:false, format:"d-m-Y","setDate": new Date(),
        }).focus();

    });

</script>

I dont know whether your datetimepicker library is loading or not.

You can use following CDN.

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.4/build/jquery.datetimepicker.full.min.js"></script>

Following code will load todays date and will show datepicker on input click

<script>

    $(document).on("click", "#datevalue" , function() {

        $(this).datetimepicker({
            timepicker:false, format:"d-m-Y","setDate": new Date(),
        }).focus();

    });

</script>

回复收藏 0 原文

~没有更多了~