jquery ui datepicker：自定义dayname标头

基本信息：我正在使用datpicker设置商店的开放时间..整整一年。为此，我有按钮来选择整年的所有星期一等，然后我有其他按钮，添加类。例如，您点击“星期一”，即选择日历中一年中的所有星期一。然后你点击“班级”按钮，所有星期一到达开放时间'9：00-17：00'。jquery ui datepicker：自定义dayname标头

我通过为每天的课程信息保存366天的数组来完成此操作。因此，每个选择一天或多天都会简单地转换为一年中的某一天，并更新数组的索引。

这很好，但现在我想在一周的基础上实现相同的效果。所以我做了以下几点：

我想实现自定义daynames，把它们变成链接来选择例如当月的所有星期一。我得到了什么至今：（ 'UI的日期选择器组'）

//javascript 
$("#datepicker").datepicker({ 
... 
    beforeShowDay: setHollidays, 
    dayNamesMin: ['<a class="weekSelector" href="7">Zo</a>', 
        '<a class="weekSelector" href="1">Ma</a>', 
        '<a class="weekSelector" href="2">Di</a>', 
        '<a class="weekSelector" href="3">Wo</a>', 
        '<a class="weekSelector" href="4">Do</a>', 
        '<a class="weekSelector" href="5">Vr</a>', 
        '<a class="weekSelector" href="6">Za</a>'], 
    monthNames: ['January<span class="invisible">0</span>', 
    'February<input type="hidden" value="1" class="invisible"/>', 
    'March<input type="hidden" value="2" class="invisible"/>', 
    'April<input type="hidden" value="3" class="invisible"/>', 
    'May<input type="hidden" value="4" class="invisible"/>', 
    'June<input type="hidden" value="5" class="invisible"/>', 
    'July<input type="hidden" value="6" class="invisible"/>', 
    'August<input type="hidden" value="7" class="invisible"/>', 
    'September<input type="hidden" value="8" class="invisible"/>', 
    'October<input type="hidden" value="9" class="invisible"/>', 
    'November<input type="hidden" value="10" class="invisible"/>', 
    'December<input type="hidden" value="11" class="invisible"/>'], 
... 
}); 

//selects all days of the month (for one month) that are a given week days. for example: all mondays 
$("a.weekSelector").click(function() { 
    selDay = $(this).attr("href"); // get the day index 
    markerType = 'month'; //use in beforeShowday function to select the days

//添加代码 VAR容器= $（本）.parent; （$（container）.find（'。invisible'）。val（））; //结束附加代码 $（“＃datepicker”）。datepicker（“refresh”）; resetMultiSelect（）; //重置用于选择的变量
返回false; }）;

//setHollidays adds the correct classes the the days.

这也适用，但如果日子总是在第一个月（即一月）被选中。因为我没有访问本月。所以当我选择'星期一'为月份'3月'时，所有1月份的星期一都被选中。

因此，最后这里是我的问题：我怎样才能得到$（“a.weekSelector”）中的月份（或月中的第一个日期）。

编辑：当它完成后，它将变成一个Drupal模块，可能是一个jQuery插件。

来源

2011-10-02 mrRuben

好吧，我更进一步。我在monthNames后面添加了隐藏的输入字段以存储月份ID /值。现在我可以在$（“a.weekSelector”）。click函数中查看该字段。我现在遇到的问题是，警报显示空值而不是月份值。我尝试了跨度和隐藏的输入...任何想法，为什么这不起作用？ – mrRuben

这里是我的“脏”的方式来解决它（在点击功能）：

var el = $(this); 
var offset = el.offset(); 
var elTop = offset.top; 
var elLeft = offset.left; 

var arr = $("a.weekSelector[href='"+selDay+"']"); 
$.each(arr, function(i, val) { 
var curTop = $(val).offset().top; 
var curLeft = $(val).offset().left; 
if((elTop == curTop) && (elLeft == curLeft)) 
{ 
selmonth = $(".invisible:eq("+i+")").val(); 
} 
});

这是什么基本上做的是检索所有weekselectors用相同的HREF作为一个点击（例如所有的“星期一'链接），然后将偏移量与点击元素的偏移量进行比较。然后我使用我从中得到的id来搜索隐藏字段。

我试图通过DOM查找隐藏字段，但它总是返回undefined。

来源

2011-10-05 10:54:26 mrRuben

jquery ui datepicker：自定义dayname标头

回答

相关问题