1

我希望能够独立控制多个 jquery-ui datepicker 的字体大小。我有 2 个日期选择器链接到文本输入。像这样声明：
$('#Date1').datepicker({firstDay: 1,showWeek: true});
$('#Date2').datepicker({firstDay: 1,showWeek: true});

在 HTML 中，它们的使用方式如下：
<input type="text" size=10 maxlength=10 id="Date1">
<input type="text" size=10 maxlength=10 id="Date2">

如何独立更改日期选择器的字体大小？
<style type="text/css"> .ui-datepicker { font-size: 12px; } </style>
影响两个日期选择器。
<style type="text/css"> #Date1 { font-size: 12px; } </style>什么也没做。
如果我创建一个<div>周围，<input>它也会影响我不想要的文本输入。

谢谢。

4

4 回答 4

0

尝试

$('#Date1 > .ui-datepicker').css({ 'font-size': 12px});
于 2012-08-16T16:59:53.857 回答
0

您不能单独更改字体大小，它对两个日期选择器使用相同的元素，这是我的 JSfiddle，如果您检查输入字段上的元素，您会明白我的意思。

http://jsfiddle.net/m7q3H/56/

于 2012-08-16T17:03:38.193 回答
0

如果你是一个 div，你可以只定位日期选择器而不是输入，就像这样

  div#newDiv .ui-datepicker:first-child  //gets you the first one
  div#newDiv .ui-datepicker:last-child  //gets you the last one
于 2012-08-16T17:04:07.237 回答
0

由于无论您创建多少个实例，日期选择器都使用同一个日期选择器，因此最好的办法是添加和删除依赖于实例的类。

请参阅此jsFiddle 示例。

jQuery

$('#Date1').datepicker({
    firstDay: 1,
    showWeek: true
});
$('#Date2').datepicker({
    firstDay: 1,
    showWeek: true,
    beforeShow: function(input, inst) {
       $('.ui-datepicker').addClass('bigFont');
    },
    onClose:function(input, inst) {
       $('.ui-datepicker').removeClass('bigFont');
    }
});​
于 2012-08-16T17:18:10.867 回答