使用jquery datepicker将日期属性添加到日期

时间:2013-06-27 14:46:21

标签: javascript jquery datepicker jquery-ui-datepicker

我有一个jquery datepicker,它已经变得非常复杂,但我想在某些日期的td添加另一个属性

我已根据数组中的一组日期(根据选择菜单中的选项创建)将某些日期显示为绿色,但我还想将包含其他信息的属性添加到这些日期。

这是我到目前为止的代码(包括我要添加的价格数组):

$('.propertyAvailabilityCal').datepicker({
beforeShow: function(input, inst) {
    startDates = [];
    startPrice = [];
    selectdatesElem = $(input).siblings("select.startdates");
    $(input).siblings("select.startdates").find("option").each( function() {
          var startdateParts = $(this).val().split(', ');
              startDates.push(startdateParts[0] + ", " + (parseInt(startdateParts[1], 10)-1) + ", " + parseInt(startdateParts[2], 10));
    });
    $(input).siblings("select.startprice").find("option").each( function() {
          startPrice.push($(this).val());
    });


},
beforeShowDay: function(date) {

    for (i = 0; i < startDates.length; i++) {
          if (date.getFullYear()+", "+date.getMonth()+", "+date.getDate() == startDates[i]) {
                return [true, 'eventDay', date];
          }
    }

    return [false, ''];
}
});

<select class="startPrice">
    <option value="274.95"></option>
    <option value="274.95"></option>
    <option value="274.95"></option>
    <option value="274.95"></option>
    <option value="274.95"></option>
</select>
<select class="startdates">
    <option value="2013, 06, 28"></option>
    <option value="2013, 07, 01"></option>
    <option value="2013, 07, 08"></option>
    <option value="2013, 07, 11"></option>
    <option value="2013, 07, 18"></option>
</select>

我希望能够将价格作为属性添加到该日期。这甚至是可能的,如果是这样,有谁知道怎么做?

这是一个jsfiddle来展示我想要实现的目标,但价格出现而不是您将鼠标悬停在某个日期上的日期......

http://jsfiddle.net/9tapA/

由于

1 个答案:

答案 0 :(得分:1)

试试这个

FIDDLE

btw,$(input).siblings("select.startPrice")。记住css选择器是区分大小写的