0

我有这个代码：

$('.ui-datepicker-calendar tr').live('mouseleave', function() { 
    $(this).find('td a').removeClass('ui-state-hover'); 
});

这会影响页面上的所有日期选择器。我想定位一个特定的日期选择器，所以我这样做：

var specificPicker = $(this).datepicker("widget");

然后我想做：

$(specificPicker).find('.ui-datepicker-calendar tr').live('mouseleave', function() { 
    $(this).find('td a').removeClass('ui-state-hover'); 
});

但live()不支持链接。

该文档建议live()已弃用，我应该使用，但如果我用而不是on()替换这两种调用方法中的任何一种，它就不起作用。.on.live

我怎样才能得到这个工作？

4

3 回答 3

1

由于工作方式，你不能这样做.live()。它将事件附加到文档本身，然后检查事件来自的元素是否与$('...')调用之前使用的选择器匹配.live()。

正确的使用方法.on()是这样的：

$('existing-element-selector')
    .on('mouseleave', '.dynamic-element-selector', callbackFunction);

在你的情况下是这样的：

$(specificPicker).on('mouseleave', '.ui-datepicker-calendar tr', function() {
    // ...
});
于 2012-10-18T12:08:30.490 回答
0

替换.live()为.on()不是查找和替换操作。

你需要改变这个：

$("selector").live("event", handler);

对此：

$("base-selector").on("event", "descendant-selector", handler);

base-selector和的值descendant-selector必须从初始的selector; 您可以使用documentasbase-selector并设置为直接转换的descendant-selector任何内容selector。

因此，为了实现与此相同的行为：

$(specificPicker).find('.ui-datepicker-calendar tr')
.live('mouseleave', function() { 
    $(this).find('td a').removeClass('ui-state-hover'); 
});

做这个：

$(specificPicker).on("mouseleave", '.ui-datepicker-calendar tr', function() { 
    $(this).find('td a').removeClass('ui-state-hover'); 
});
于 2012-10-18T12:08:52.023 回答
0

如果您要坚持使用您正在使用的 jQuery 版本，因此坚持使用 using live()，试试这个...

$(specificPicker).find('.ui-datepicker-calendar tr').each(function() {
    $(this).live('mouseleave', function() {
        $(this).find('td a').removeClass('ui-state-hover');
    });
});

只需用于each()解析所选元素并将事件处理程序附加到它们。

于 2012-10-18T12:10:54.860 回答