Question

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

有没有办法指出a节点的孩子，即。那条线上的img节点？

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 + ")");  
});

Answer 1

this确实会指向单击处理程序中单击的锚点。您无能为力，但您的点击处理程序将形成对img变量的封闭。

这是你想要的吗？

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

编辑

正如Felix所指出的那样，a已经是一个jQuery对象了，所以你可以这样做：

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

Answer 2

是的，你可以这样做：

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

Answer 3

我想你可以做到：

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

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

3 个答案: