使用'this'在节点的子节点上应用事件

我有一个动态创建div框并在其上放置事件的函数。在该框中，我创建了一个a-node，并在其中创建了一个img-node。当我点击a-节点时，事件将被触发，并且背景图像将在另一个div上被改变。下面你可以看到我的代码，就像现在这样，'this.src'指向a节点，这当然不起作用。使用'this'在节点的子节点上应用事件

有没有办法指向a节点的孩子，即。该行的img-node？

var box = $('<div/>', { 
    'class': 'imgDiv', 
    'width': maxWidth, 
    'height': maxHeight, 
}).appendTo('.windowContent'); 

var a = $('<a/>', { 
    'href': '#', 
}).appendTo(box) 

var img = $('<img/>', { 
    'src': 'pics/' + this.fileName, 
    'width': this.thumbWidth, 
    'height': this.thumbHeight, 
}).appendTo(a); 

$(a).click(function() { 
    $('#desktop').css("background-image", "url(" + this.src + ")"); 
});

来源

2011-12-18 holyredbeard

this确实会指向单击处理程序内部单击的锚点。没有什么可以做的，但是你的点击处理器将会在你的变量img上形成一个闭包。

这是你想要的吗？

$(a).click(function() { 
    $('#desktop').css("background-image", "url(" + img.attr("src") + ")"); 
});

编辑

随着菲利克斯指出，一个已经是一个jQuery对象，所以你可以简单地做：

a.click(function() { 
    $('#desktop').css("background-image", "url(" + img.attr("src") + ")"); 
});

来源

2011-12-18 00:15:54

这将是'img.attr（'src'）'，不是吗？ – 2011-12-18 00:16:38

@JaredFarrish - 当然 - 谢谢 – 2011-12-18 00:17:50

请注意，'a'已经是一个jQuery对象（所以不需要再次将它传递给jQuery）。 – 2011-12-18 00:21:40

我想你可以这样做：

$(a).click(function() { 
    $('#desktop').css("background-image", "url(" + $(this).find("img").attr("src") + ")"); 
});

来源

2011-12-18 00:16:08

FWIW，'a'已经是一个jQuery对象。 – 2011-12-18 00:17:47

@FelixKling当然你是对的，更新了我的答案。谢谢！ – 2011-12-18 00:19:32

这不是我的意思;）'$（this）'是正确的，但是你可以把'$（a）'改成'a'。 – 2011-12-18 00:20:38

是的，你可以这样做：

a.click(function() { 
    var $imgSrc = $(this).find("img").attr("src"); 
    $('#desktop').css("background-image", "url(" + $imgSrc + ")"); 
});

来源

2011-12-18 00:16:19

使用'this'在节点的子节点上应用事件

回答

相关问题