jquery - 画像のスワップボタン（Jquery）

Question

ボタンがあり、クリックしたらボタンを画像に置き換えたい。JQueryでこれを行うにはどうすればよいですか？画像の背景も入れ替えることはできますか？ボタン自体は大きなdiv内にあり、前のレイアウトを台無しにするため、ボタンの周りに別のdivを追加したくありません。

Answer 1

ボタン要素を交換する場合：

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

ボタンの背景画像を変更する場合：

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

画像の背景画像を変更する場合（：S）：

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

Answer 2

ボタンがクリックされたときに何をしたいのか正確にはわかりませんが、次のようになります。

$('button').click(function()
{
   $(this).css({ // properties you want to change });
});

トリックを行う必要があります。