2012-04-23 55 views
1

我的主页由选项卡类型控件控制,我有一个专门为此设计的样式表。不过,我最近才意识到我的应用程序中还需要一个日期选择器。我已将jquery-ui-style.cs样式表添加到我的项目中。问题是我只想让这个样式表影响我的日期选择器而不是我的选项卡。如何将样式表应用于我的jquery datepicker小部件?

是否有这个样式表仅适用于我的日期选择器既可以当页面最初加载或当文本框是专注于一种方式?

它可能不是必要的,但这里是我的jQuery的日期选择器:

$(function() { 
    $("#txtViewWeeksData").datepicker({ 
     changeMonth: true, 
     changeYear: true, 
     showOtherMonths: true, 
     selectOtherMonths: true 
    }); 
}); 
+4

在短短几年内这个问题的答案将是容易的,'<风格作用域=“真”> ..'不幸的是,现在你坚持使用一类或类似的范围了。 :( – Andrew 2012-04-23 17:41:56

+0

似乎很棘手,你只能添加一个outerscope,目前在Themeroller /下载。所以你将不得不编辑CSS,然后在jquery中添加/删除它之前显示/关闭 – 2012-04-23 17:56:38

回答

3

可悲的是没有“简单”的方法。

但我在这里做一个例子:在“主题”,选择“高级” http://jsfiddle.net/ggwGs/9/

在下载页面(http://jqueryui.com/download)就可以了。您可以在哪里创建自定义“CSS范围”,输入特殊主题名称,例如“.customTheme”,然后按donnload。

如果您已经创建了自定义主题,则在“下载主题”下执行的操作完全相同。

现在我们需要的CSS范围类添加到日期选择器活跃的时候,和删除时不。

所以我们做这样的:

$("#txtViewWeeksData").datepicker({ 
    changeMonth: true, 
    changeYear: true, 
    showOtherMonths: true, 
    selectOtherMonths: true, 
    beforeShow: function(input, inst) {$(inst.dpDiv).addClass('customTheme');}, 
    onClose: function(dateText, inst) {$(inst.dpDiv).removeClass('customTheme');} 
}); 

Basicly我们告诉它显示添加范围之前正确的,它的封闭之后便又将其删除。

相关问题