javascript - 具有不同样式的多个 jQuery UI 日期选择器

标签 javascript jquery jquery-ui

我的页面上有两个 jQuery 日期选择器:

  • 一个普通的
  • 只能选择年份/月份的“特殊”。

特殊的使用一些自定义 CSS ( from here ) 来隐藏日历部分,因此只显示月份/年份。

.ui-datepicker-calendar {
    display : none ;
}

但是,由于页面上只有一个对话框实例,因此两个选择器的日历都是隐藏的。

有没有办法只将这种样式应用于其中一个实例?我已经检查了文档以查看是否可以将自定义类添加到对话框,但我找不到它。

最佳答案

我正在解决同样的问题。上面的答案不起作用。此评论中提供的解决方案起作用了:http://www.filamentgroup.com/lab/using_multiple_jquery_ui_themes_on_a_single_page/#commentNumber16

我对它做了一些修改,这是我得到的:

$('#startDate').datepicker( {
    beforeShow: function(input, inst) {
        var newclass = 'calendar-base hideDates'; 
        var p = inst.dpDiv.parent();
        if (!p.hasClass('calendar-base'))
            inst.dpDiv.wrap('<div class="'+newclass+'"></div>');
        else
            p.removeClass('showDates').addClass('hideDates');
    }
});
$('#birthDate').datepicker( {
    beforeShow: function(input, inst) {
        var newclass = 'calendar-base showDates'; 
        var p = inst.dpDiv.parent();
        if (!p.hasClass('calendar-base')){ 
            inst.dpDiv.wrap('<div class="'+newclass+'"></div>');
        else
            p.removeClass('hideDates').addClass('showDates');
    }
});

我已经检查过了,它有效。

关于javascript - 具有不同样式的多个 jQuery UI 日期选择器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3311249/

相关文章:

javascript - mySql/Express GET 请求到 React Native 应用程序中的动态 SELECT 查询

javascript - 当我动态添加新的日期选择器时,以前的日期选择器值会重置吗?

javascript - 禁止在悬停时打开 jquery 菜单中的子菜单

jquery - 在 Datepicker JQuery UI (1.10.x) 和 JQuery (1.9.x) 中突出显示一整周

javascript - 从 javascript [Firefox/XUL] 更改 CSS 类内容

javascript - 在 PIXI.JS 中运行动画循环

javascript - JQuery 使用 jQuery Post 和 data() 将数据发送到页面

javascript - jQuery - 设置 div 的最小高度

javascript - 检索元素的 dataTable 对象

javascript - map 中的可拖动标记