javascript - 联系表 7 - 日期选择器

Question

如果我使用联系表单 7 日期选择器插件，如何在日期字段添加图像？我想要的例子在这个网站上，Jquery Datepicker 。这是我所做的代码:

[date* your-date id:datepicker class:required 15/ " "]

在我的页面主题上添加，

$(document).ready(function(){
   $("#datepicker").datepicker({
        showOn: "button",
        buttonImage: "http://jqueryui.com/resources/demos/datepicker/images/calendar.gif",
        buttonImageOnly: true
   });
});

但它在表单上没有显示图像，并且在控制台面板上有以下错误，

Uncaught TypeError: $(...).datepicker is not a function

Answer 1

可能您忘记包含 lib js。例如jquery.min.js、jquery.ui.js、jquery-ui.css

查看代码

$(document).ready(function(){
$("#datepicker").datepicker({
        showOn: "button",
        buttonImage: "http://jqueryui.com/resources/demos/datepicker/images/calendar.gif",
        buttonImageOnly: true
   });
})

<link href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<input type="text" id="datepicker"/>

您还可以在 JsFiddle 中看到.