jquery-ui - jquery点击替换为另一个图像

Question

当我单击添加图像 div 时，我应该用另一个背景为白色的十字图像替换当前图像

你能告诉我如何完成它...：http: //jsfiddle.net/6Mmme/11/

交叉图像https://docs.google.com/file/d/0B3IBJKENGE7ReWpack5aWmdLSmc/edit

$("div").hover(
  function () {
    $(this).append($("<div>add image</div>"));
  }, 
  function () {
    $(this).find("div:last").remove();
  }
);

Answer 1

最直接的方法是改变子元素的src属性：<img><div>

$("div").hover(
    ....
).click(function() {
    $(this).children("img").attr("src", "newUrl");
});

见http://jsfiddle.net/6MmMe/15/

更新：如果您想在单击“添加图像”div 时更改图像，您可以使用以下代码

$("div").hover(
  function () {
    $("<div>add image</div>").click(function () {
        $(this).parent().children("img").attr("src", "newUrl");
    }).appendTo(this);
  }, 
  function () {
    $(this).find("div:last").remove();
  }
);

见http://jsfiddle.net/6MmMe/20/

Answer 2

$(".container").on("click", function(){
    $(this).find('img').attr('src', 'https://lh3.googleusercontent.com/m7_Lya1KfrYkW1_i1ZyiTrDu6xazZzfvEvG2I6vS7L66QMYQhbhfDxw5SGLu6o-7d5q0y8HY-zVyudf2');                         
});