jQuery DatePicker没有显示
你好我正在尝试创建一个简单的文本框,当用户点击它时出现一个日期选择器。我有以下我的头装:jQuery DatePicker没有显示
<link rel="stylesheet" href="css/start/jquery-ui-1.8.13.custom.css">
<script src="js/jquery-1.5.1.min.js"></script>
<script src="js/jquery-ui-1.8.13.custom.min.js" type="text/javascript"> </script><!-- Was missing closing tag
<script>
$(function() {
$("#datepicker").datepicker();
});
</script>
而且在我的身上,我有以下文本框:
<body>
<input id="datepicker" class="hasDatepicker" type="text">
</body>
我的问题是,当我尝试单击文本框,什么都不会发生。我不确定问题可能是什么。任何建议表示赞赏。
UPDATE:
试过CDN还下载了整个jQuery UI的包,但仍无法显示。在IE和Firefox都试过。
更新2:
希望我上面修正会解决它是语法错误,但没有骰子。
使用CDN进行测试以确保您拥有完整的jQuery UI。你的电话是正确的...
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js" charset="utf-8"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js" charset="utf-8"></script>
我有一个类似的问题。
打开样式表并找到.ui-helper-hidden-accessible
。
如果存在clip: rect(1px,1px,1px,1px);
的重复行,请将其删除(您可能需要删除这两行)。这为我解决了这个问题。
有一个重复的行,但似乎没有解决问题。 – kingrichard2005 2011-06-10 00:11:30
我删除了两个,它为我工作 - 奇怪 – Chris 2011-07-21 08:54:02
@Chris:我会更新答案说一个或两个!谢谢! – 2011-07-21 15:33:20
如果您有多个日期选择器实例,请尝试使用类而不是ID,原因是ID需要对元素唯一,或者调用jQuery无法运行该函数,这是因为函数不知道脚本放在页面上的什么特定元素。
该脚本看起来像这样
<script>
$(function() {
$(".datepicker").datepicker();
});
</script>
和元素看起来像这样
<input id="myInput" class="datepicker hasDatepicker" type="text">
我希望这有助于
的jQuery UI添加了 “hasDatepicker” 级的输入点击后。尝试删除hasDatepicker类。如果您正在使用诸如$('。hasDatepicker')之类的jQuery选择器来选择输入,请尝试给它另一个类名称。
好呼!我有这个问题 – SketchyTurtle 2015-04-07 21:00:24
我敢肯定你会现在已经解决了这个问题,但这里有几件事情我会尝试:
确保您抓住的jQuery其次是jQuery用户界面和.datepicker样式表存在。
更改它寻找一个ID一类的日期选择提出了自己的ID英寸
如果它是在一个点击事件,确保一个datepicker之前没有被应用到元素(因此,一个新的每个新元素的日期选择器)。 E.G:
$(".addOffer").click(function(){
//Code to add an offer (ensuring it has the class .latest)
$("#offers").append("<input type='text' name='datePicker' class='datepickerNew latest' />");
//Add date picker
$("#offers .latest.datepickerNew").datepicker().removeClass('latest');
});
请从输入标记中移除hasDatepicker类,它应该可以正常工作。
class = 'hasDatepicker' //Need to remove
我有类似的问题。 我的决议是在.date-picker
添加z-index
的datePicker.css
.date-picker {
position: absolute;
z-index:1000;/*********** MY Change *************/
font-size: 1em;
color: #CCC;
text-align: center;
cursor: default;
border: 1px solid #444;
border-radius: 2px;
margin: 6px 0;
background: #222;
box-shadow: 8px 8px 12px rgba(0, 0, 0, 0.2);}
而且这种变化的日期选择器开始显示。
您使用jQuery UI的自定义包,您确定它包含datepicker要求吗? – Zachary 2011-06-09 22:42:28
@Zachary说什么。 – 2011-06-09 22:43:06
我会仔细检查一下,我正在查看可下载的自定义软件包附带的小演示,并且在那里显示正常。日期选择器的要求是什么? – kingrichard2005 2011-06-09 22:45:55