Javascript 为什么jQuery1.7.x中会出现这种情况?

Javascript 为什么jQuery1.7.x中会出现这种情况?,javascript,jquery,Javascript,Jquery,以下代码snipplet显示了我的问题: var $div = $('<div>'); $('span').live('click', function() { this.innerHTML = 'changed'; }); $div.append( $('<span>span</span>').click() ); $div.appendTo('body'); ​ var$div=$(''); $('span').live('click',f

以下代码snipplet显示了我的问题:

var $div = $('<div>');

$('span').live('click', function() { this.innerHTML = 'changed'; });

$div.append(
    $('<span>span</span>').click()
);

$div.appendTo('body');
​
var$div=$('');
$('span').live('click',function(){this.innerHTML='changed';});
$div.append(
$('span')。单击()
);
$div.appendTo('body');
​
这在jQuery中正常工作,但在

为什么它在1.7.x中不起作用?是虫子吗?有没有办法让它在1.7.x中工作

编辑:

从jQuery 1.7开始,.live()方法已被弃用。使用.on()附加事件处理程序

(正如评论者所指出的,这在JQ1.7中仍然有效)

您的编辑:

试一试

var$div=$('');
变量span=$('span');
span.单击(函数(){
this.innerHTML='changed';
});
$div.append(
span.单击()
);
$div.appendTo('body');
​ ​

您正在传递
的结果。单击()
。追加()
。有趣的是,它在1.6中工作,因为函数没有返回任何内容。这可能是由于
.live
工作方式或
方式的内部更改。单击
调用其侦听器

var$div=$('');
$('span').live('click',function(){this.innerHTML='changed';});
$div.append(
$(“span”)
);
$div.appendTo('body');
$('span')。单击();

事件处理的工作方式在1.7版本中发生了变化。在将
添加到DOM之前,在其上触发的事件不会像以前那样出现在
上(在我看来,这是错误的;1.7行为更有意义)

上触发事件可能会起作用,但由于事件不会向
冒泡,因此无法调用处理
.live()
安装程序的实际处理程序

编辑-它可能是事件冒泡到的文档元素;不管怎样,重点都是一样的

再次编辑-这里有一种方法可以使此工作正常,以便您可以在将元素添加到DOM之前触发处理程序:

$('<div></div>').on('click', 'span', function() {
    this.innerHTML = "Changed!";
}).append($('<span>span</span>'))
  .find('span').click().end()
  .appendTo($('body'));
$('')。在('click','span',function()上{
this.innerHTML=“已更改!”;
}).append($('span'))
.find('span')。单击()。结束()
.附于($(“正文”);

将“单击”处理程序直接设置为新生的
上的委托处理程序。然后,在将新的
附加到该元素之后,就可以触发对该
的“单击”,并调用处理程序。在将整个内容附加到1.6和1.7的工作解决方案之前,就会发生这种情况

var $div = $('<div>');
$('span').live('click', function() { this.innerHTML = 'changed'; });
$div.append('<span>span</span>');
$div.appendTo('body');
$('span').trigger('click');

这对我来说很好。。。。问题是什么?当我测试这个时,在JQ 1.6.x上的pageload上,span被更改为'changed',但在1.7.x上,它会等待单击。看看你的代码,这难道不是你想要的行为吗?@alykhalid:不,我想在添加click函数之前调用它。它们都应该在其附件之前设置为“chaned”
$的返回值。click()
是一个jQuery对象,在本例中是span元素。它不返回回调函数的返回值。正如您在OP的演示中所看到的,span元素被附加到div中,只是click事件没有被触发。我希望在附加之前调用事件处理程序。你所做的一切就是附加它,然后触发它。我希望在附加它之前对它进行更改。即使我很清楚地调用了该事件,也没有调用它,因为在使用委托时它需要在div中:您可以使用此解决方案,但当您要添加多个跨距时,它的效率不是很高。@qwertymk请检查我的更新答案,以了解在1.7.x中执行此操作的方法,以便在元素附加到大教堂。您需要在新容器元素上建立委托,然后在将目标元素附加到该容器元素之后(但在附加到主DOM之前)触发事件.有没有什么方法可以让我不必先将它附加到主体中,也不必将事件处理程序绑定到每个元素中就可以完成我正在尝试的事情?Pointy是对的,旧的行为是一个bug,只存在大约一个版本。元素应该在DOM中,以便事件可以正确冒泡。如果您正在做一些事件不希望遵守文档结构的事情,我建议使用一个pub/sub插件,如Amplify.js或Ben Alman的微型pub/sub。@qwertymk是的,这正是我更新的示例所做的。它在您正在构建的容器元素上设置事件处理程序。然后,您可以向其中添加所需的所有元素,但因为它不是真正DOM的一部分,它们却不在页面上。然后,您可以在将外部容器添加到DOM之前触发事件并调用处理程序。是的,但这仍然涉及在元素被追加到DOM之后触发处理程序。@Pointy,处理程序应该与追加逻辑分开,因此也会触发后续操作。让我们看看OP是怎么想的
$('<div></div>').on('click', 'span', function() {
    this.innerHTML = "Changed!";
}).append($('<span>span</span>'))
  .find('span').click().end()
  .appendTo($('body'));
var $div = $('<div>');
$('span').live('click', function() { this.innerHTML = 'changed'; });
$div.append('<span>span</span>');
$div.appendTo('body');
$('span').trigger('click');
$('span').on('click', function() { this.innerHTML = 'changed'; });