加载时jQuery datepicker表示未定义。

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了加载时jQuery datepicker表示未定义。相关的知识,希望对你有一定的参考价值。

我试图在我的表单中实现日期选择器,但是当添加日期选择器的代码没有显示在酿酒师中时。检查控制台时发出此错误TypeError:'undefined'不是函数(评估'$(“#datepicker”)。datepicker()')jQuery库文件添加在根文件夹中。

贝娄是使用的代码:

$(document).ready(function() {
$( "#datepicker" ).datepicker();
});

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Datepicker</title>
<link rel="stylesheet" href="jquery-ui-1.10.4.custom.css">
<script src="jquery-1.10.2.js"></script>
<script src="datepicker.js"></script>
</head>
<body>

<p>Date: <input type="text" id="datepicker"></p>


</body>
</html>
答案

你需要在包含jQuerydatepicker核心文件后放入你的jQuery代码:

<script src="jquery-1.10.2.js"></script>
<script src="datepicker.js"></script>
<script>
    $(document).ready(function() {
        $( "#datepicker" ).datepicker();
    });
</script>
另一答案

您可能还需要在jquery-1.10.2.js条目之后添加jquery-ui.js。

尝试放置

$(document).ready(function() {
$( "#datepicker" ).datepicker();
});

在html标记之后的文件末尾和脚本标记周围,例如

<script type="text/javascript">
$(document).ready(function() {
$( "#datepicker" ).datepicker();
});
</script>
另一答案

我刚刚在VS2012中尝试了以下代码,它可以工作。您需要将版本号更改为您自己的版本号。

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link href="Content/themes/base/jquery-ui.css" rel="stylesheet" />
    <script src="Scripts/jquery-1.7.1.js"></script>
    <script src="Scripts/jquery-ui-1.8.20.js"></script>

</head>
<body>
    <form id="form1" runat="server">
    <div>
    <p>Date: <input type="text" id="datepicker"></p>
    </div>
    </form>
</body>
</html>

<script type="text/javascript">
    $(document).ready(function () {
        $("#datepicker").datepicker();
    });
</script>
另一答案

确保所有脚本都指向工作区中的正确位置。

在完成必要的包含之后,尝试将jQuery的document.ready函数放在head标记内。

我想通过标记,脚本标签可以放在body标签或head标签内

希望这有效。

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Datepicker</title>
<link rel="stylesheet" href="jquery-ui-1.10.4.custom.css">
<script src="jquery-1.10.2.js"></script>
<script src="datepicker.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$( "#datepicker" ).datepicker();
});
</script>
</head>
<body>

<p>Date: <input type="text" id="datepicker"></p>


</body>
</html>

这非常有效。

jsぇdでも但是:z zxswい

HTML:

http://jsfiddle.net/arunkumars08/98CRq/

JS:

<p>
Date: 
<input type="text" id="datepicker" />
</p>
另一答案

我有同样的问题。我做的是修复它是在控件之后添加对脚本的引用。

$(document).ready(function() {
$( "#datepicker" ).datepicker();
});
另一答案

您需要添加将为您的输入标签调用datepicker的函数。将js代码放在文件的末尾。也不要忘记将此代码包含在一个将自行执行的函数中:

<head>
  <link href="../Scripts/jquery-ui-1.11.1.custom/jquery-ui.css" rel="stylesheet" />
  <script src="../Scripts/jquery-2.1.1.js"></script>
</head>
<body>
  <div>
    <input type='text' onkeypress='return false' class='datepicker' />
  </div>
  
  <script src="../Scripts/jquery-ui-1.11.1.custom/external/jquery/jquery.js"></script>
    <script src="../Scripts/jquery-ui-1.11.1.custom/jquery-ui.js"></script>
  <script>
        $(this).ready(function () {
            $(".datepicker").datepicker();
        });
    </script>
</body>

要么

<script type="text/javascript">
$(document).ready(function() {
$( '#datepicker' ).datepicker();
});
</script>

以上是关于加载时jQuery datepicker表示未定义。的主要内容,如果未能解决你的问题,请参考以下文章

bootstrap-datepicker 抛出未定义的 jQuery

jQuery UI datepicker - 如果使用 $('').datepicker('option', ),则加载时输入无效

选择日期时,JQuery Datepicker 未正确更新我的 var

使用 jQuery Datepicker 使日期在加载时无法选择

覆盖在第一页加载时奇怪可见的 jQuery UI Datepicker div。

OnClick日历图标日历未打开Jquery Datepicker