jquery datepicker超出css范围
Posted
技术标签:
【中文标题】jquery datepicker超出css范围【英文标题】：jquery datepicker out of css scope 【发布时间】：2011-05-05 02:21:06 【问题描述】：我在一页中使用了多个 ui 主题。我创建了一个具有css 范围的自定义主题，比如说#scope。我在范围内使用了一个日期选择器字段，比如说#scope input#datepicker。 datepicker 字段没有从 ui 主题中获取 css 样式。我猜这是因为它是在#scope 之外动态创建的，我该如何更改它，以及如何让它从作用域中获取样式。
【问题讨论】：
【参考方案1】：我通过在代码中添加包装 div 解决了这个问题。
$(document).ready(function()
$("#ui-datepicker-div").wrap('<div class="ui-layout-center" />');
);
【讨论】：
只是为了澄清“ui-layout-center”是您的自定义 css 类，对吗？我个人会尽量避免使用与 jQuery UI 的其余部分相同的 ui- 前缀，以避免在未来版本中可能出现名称冲突。【参考方案2】：@bkilinc，你是对的。 datepicker 日历被附加到 document.body，在您的自定义范围之外。
http://bugs.jqueryui.com/ticket/4591 http://bugs.jqueryui.com/ticket/4306
在像下面这样的结构中，日历超出了容器的范围。
<style type="text/css">
.calendarContainer .ui-datepicker
/* rule intended to affect only .calendarContainer */
</style>
...
<body>
<div class="calendarContainer"><input name="date"/></div>
<div class="ui-datepicker"> (generated calendar)</div>
</body>
【讨论】：
【参考方案3】：我记得有同样的问题，检查一般定义的样式例如span，它可能与ui样式重叠。
【讨论】：
以上是关于jquery datepicker超出css范围的主要内容，如果未能解决你的问题，请参考以下文章
DatePicker 不设置年份，除非当原始年份超出下拉范围时显式更改下拉列表
DatePicker [ eyecon ] 设置日期范围 jquery/javascript