图像交换按钮（jQuery的） [英] Swap button for image (Jquery)

问题描述

我有一个按钮，它被点击的时候，我想用图像被替换的按钮。我怎样才能在JQuery中做到这一点？是有可能替换图像的背景中呢？按钮本身是一个大的专区内，我不希望添加按钮周围另一个div，因为它搅乱了previous布局。

I have a button and when it's clicked, I want to replace the button with an image. How can I do this in JQuery? Is it possible to replace the background of the image as well? The button itself is within a large div, and I don't want to add another div around the button because it messes up a previous layout.

推荐答案

如果您想更换按钮元素：

If you want to replace the button element:

$('the-button').bind('click', function () {
    $(this).replaceWith('<img src="/wherever.jpg"/>');
});

如果您想更改按钮的背景图片：

If you want to change the background image of the button:

$('the-button').bind('click', function () {
    $(this).css('backgroundImage', 'url(\'/wherever.jpg\')');
});

如果你想改变图像的背景图像（：S）：

If you want to change the background image of the image (:S):

$('the-button').bind('click', function () {
    $(this).replaceWith('<img src="/wherever.jpg" style="background-image:url(\'/somewhere-else.jpg\');"/>');
});

这篇关于图像交换按钮（jQuery的）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！