0

抱歉标题含糊不清，但我不确定如何描述。

我想要做的是onclick，更改图像。这是代码的那部分。

有人可以告诉我这是否可能吗？我看不到这样做的方法，因为我不确定如何引用锚标记。

$(document.createElement('a'))
  .attr('href', '#')
  .html('<img src="myimage.jpg" />')
  .click( function( e ){
    // When the user clicks the anchor tag above, I want to replace the current
    // image (myimage.jpg) with another one.
  }
4

5 回答 5

1

假设您想保留编写代码的状态（这很可怕），e.currentTarget是对正在单击的元素的引用。您可以使用它来.html()使用另一个图像 URL 重复您的（不鼓励的）过程。

$(document.createElement('a'))
    .attr('href', '#')
    .html('<img src="myimage.jpg" />')
    .click( function( e ){
        $(e.currentTarget).html('<img src="myimage2.jpg" />');
    });
于 2013-10-16T21:37:01.620 回答
1

最简单的方法是给图像一个类，例如“myImg”，并使用该.on()方法绑定到动态创建的元素

$(document).on('click', '.myImg', function(){
    //$(this) refers to the image that we clicked
    $(this).prop('src', 'http://my-domain.com/path/to/my/new-image.jpg');
});

这会将事件绑定到文档，并且只要单击具有“myImg”类的图像，它将替换该图像。

于 2013-10-16T21:38:31.823 回答
1 
$(document.createElement('a'))
  .attr('href', '#')
  .html('<img src="myimage.jpg" />')
  .click( function( e ){
      $(this).find('img').attr('src','myNewImage.jpg');
  });
}
于 2013-10-16T21:38:38.580 回答
1 
//create node
$('<a>', {
   'href': '#',
   'src': 'myimage.jpg'
})

//add it to the body
.appendTo('body')

//add envent
.on('click', function(){
   $(this).attr('src', 'otherimage.jpg');

   //prevent to jump to the top of the page caused by the '#'
   return false;
});
于 2013-10-16T21:38:54.843 回答
1

使用这个简单的

$('img').click(function () {
 $(this).attr('src', 'src/to/new/file.png');
}

如果要在单击结束时更改图像a。然后使用

$('a').click( function () {

而不是图像之一。

这将改变当前图像的 src 属性。

这是一个工作小提琴:)

http://jsfiddle.net/afzaal_ahmad_zeeshan/8H4MC/

当鼠标悬停在图像上时，您会看到它会发生变化。您可以使用click而不是hover. 那应该行得通。a如果您必须使用禁用它，请不要创建href="#"。

cursor: pointer如果您想在 CSS中使用指针光标或使用

$(this).css('cursor', 'pointer');
于 2013-10-16T21:39:30.693 回答