几个jQuery日期选择器小部件,只向其中一个添加类
several jquery datepicker widgets, add class to only one of them
我对jquery datepicker有问题。
我有一个包含多个日期选择器输入的表单,其中一个输入我需要选择整个星期,而在另一个输入中,我需要以常规方式工作; 问题是,当我将类(ui-weekpicker)添加到小部件中时,用户可以选择整个星期的第一个输入,该类会影响表单中的所有输入,至少是悬停事件,这意味着 onSelect 事件中的其他输入显示正确的日期...如何防止这种情况发生?这是我的周选择日期选择器的代码
$('#jump-picker').datepicker('destroy').val('').attr('placeHolder','Select Week');
$('#jump-picker').datepicker( {
yearRange: "-3:+3",
showOtherMonths: true,
selectOtherMonths: true,
language :'es',
options: {
dateFormat : 'dd/mm/yy',
showAnim : 'slideDown',
},
onSelect: function(dateText, inst) {
var date = $(this).datepicker('getDate');
var startDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay());
var endDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay() + 6);
var dateFormat = inst.settings.dateFormat || $.datepicker._defaults.dateFormat;
$('#jump-picker').val($.datepicker.formatDate( dateFormat, startDate, inst.settings )
+ ' - ' + $.datepicker.formatDate( dateFormat, endDate, inst.settings ));
var year = startDate.getFullYear(),
month = startDate.getMonth(),
day = startDate.getDate() - startDate.getDay();
$('#calendar').fullCalendar ('gotoDate', year, month, day);
selectCurrentWeek();
},
beforeShow: function() {
selectCurrentWeek();
},
beforeShowDay: function(date) {
var cssClass = '';
if(date >= startDate && date <= endDate)
cssClass = 'ui-datepicker-current-day';
return [true, cssClass];
},
onChangeMonthYear: function(year, month, inst) {
selectCurrentWeek();
}
}).datepicker('widget').addClass('ui-weekpicker').removeClass ('hide-calendar MonthDatePicker HideTodayButton');
$('.ui-weekpicker .ui-datepicker-calendar tr').live('mousemove', function() { $(this).find('td a').addClass('ui-state-hover'); });
$('.ui-weekpicker .ui-datepicker-calendar tr').live('mouseleave', function() { $(this).find('td a').removeClass('ui-state-hover'); });
感谢您的帮助
不要将调用链接到 $('#jump-picker') 选择器中对 .addClass('ui-weekpicker') 的调用,而是添加第二个调用以仅检索其中一个元素:
$('#jump-picker.week').addClass('ui-weekpicker')
或者,如果您无法将类添加到一个元素而不是另一个元素
$('#jump-picker').first().addClass('ui-weekpicker')
将类添加到匹配的第一个元素。
顺便说一句,当您有多个元素时,使用 id
是一种不好的做法,它们在文档中应该是唯一的。您最好使用jump-picker
类。
相关文章:
- 我可以在json对象中添加一个函数吗
- 单击更改图标并通过javascript添加一个css类
- 将添加一个相同类型的事件附加或覆盖以前添加的具有相同名称的事件
- 有没有添加一个ng点击到md背景
- 如何为下拉列表的每个选项添加一个属性
- 如何使用Javascript在给定的句子中找到大写单词并在其前面添加一个字符
- 在iframe中加载url并添加一个类
- 添加一个setTimeout方法会使jQuery悬停方法忽略setTimeout方法中的函数
- Jquery添加一个类之后,如何应用css
- jQuery在悬停时只添加一个类
- 添加一个javascript函数来下载elfinder上的事件
- 仅首先需要使用jasmine从节点添加一个文件
- 尝试添加一个选项以使用append进行选择,但没有任何结果
- 简单的Javascript方式,在输入字段的每5位数字后添加一个空格
- 如何使用JavaScript's”;应用“;方法,在数组之前添加一个额外的参数
- 在xsl中为body onload添加一个值
- 当用户单击按钮(在光标位置)时,在输入字段中添加一个文本字符串
- 添加一个元素,它's通过JS的类名
- 当我添加一个新数字时,如何获得一些数字的即时平均值
- 在跨度中每3个字符添加一个空格