css - 日期选择器 jquery ui-datepicker-trigger

Question

我需要将两个日历 jQuery 对象添加到 html 页面。我有以下日期选择器设置。有一个用于打开日历对象的图标图像。为了绝对定位图标图像，执行以下 css ui-datepicker-trigger 覆盖。如果我有两个日历对象，我该如何为该类创建两个覆盖，因为覆盖类命名约定的名称没有 id 名称。将代码粘贴到 http://jsfiddle.net/y6DDh/

.ui-datepicker-trigger {
    position:absolute;
    left:330px;
    top:300px;
}

$("#datepicker").datepicker({
   //showOn: both - datepicker will come clicking the input box as well as the calendar icon
   //showOn: button - datepicker will come only clicking the calendar icon
   showOn: 'button',
   //you can use your local path also eg. buttonImage: 'images/x_office_calendar.png'
   buttonImage: 'jquery/jquery-ui-1.10.3/demos/datepicker/images/calendar.gif',
   buttonImageOnly: true,
   changeMonth: true,
   changeYear: true,
   showAnim: 'slideDown',
   duration: 'fast',
   dateFormat: 'dd-mm-yy'
});


$("#datepicker2").datepicker({
   //showOn: both - datepicker will come clicking the input box as well as the calendar icon
   //showOn: button - datepicker will come only clicking the calendar icon
   showOn: 'button',
   //you can use your local path also eg. buttonImage: 'images/x_office_calendar.png'
   buttonImage: 'jquery/jquery-ui-1.10.3/demos/datepicker/images/calendar.gif',
   buttonImageOnly: true,
   changeMonth: true,
   changeYear: true,
   showAnim: 'slideDown',
   duration: 'fast',
   dateFormat: 'dd-mm-yy'
});

Answer 1

对于第一个:

#datepicker + .ui-datepicker-trigger {
    position: absolute;
    left:330px;
    top:300px;
}

对于第二个:

#datepicker2 + .ui-datepicker-trigger {
    position:absolute;
    left:530px;
    top:300px;
}

示例:http://jsfiddle.net/y6DDh/1/