圖像單擊我給了一個功能，單擊它獲取圖像ID，使用它我必須使用javascript更改圖像

Question

我給了一個功能，單擊它獲取圖像ID，使用它我必須使用javascript更改圖像。

代碼如下

$('img').live('click', function () {
     alert(this.id);
 });

輸出結果如下：like_0，like_1 ......和different_0，unlike_1 .........

但根據輸出，我必須更改圖像

$("#like_").click(function () {
    $("#tipid").val(1);
    $("#like_").attr("src", "images/ic_like_select.png");
    $("#unlike_").attr("src", "images/ic_unlike_unselect.png");
});
$("#unlike_").click(function () {
    $("#tipid").val(0);
    $("#like_").attr("src", "images/ic_like_unselect.png");
    $("#unlike_").attr("src", "images/ic_unlike_select.png");
});

我的問題是我不知道該如何更改。 有人可以幫我謝謝。

Answer 1

你可以看看jQuery的切換功能

x.toggle(function(){}, function(){})

這里已經做了類似的事情！

Answer 2

據我了解，您想更改圖片，並且必須根據ID進行更改。

我將解釋在您的位置嘗試的方法：

讓我們假設這是我要更改的圖片：

<img id='like_0' src='/path/to/image' />

因此，一旦您獲得了該圖片的ID（像_0），就可以在javascript函數中嘗試以下操作：

document.getElementById("like_0").src="../path/new_img.png";

最后一條指令將圖像路徑更改為新路徑

Answer 3

小提琴演示

like_img="like_url";
unlike_img="unlike_url";

toggle=function(){
    if($(this).attr("id").match(/^like_/)!=null)
    {
        if($("#tipid").val()==0)
        {
            $("#tipid").val(1);
            $("[id^=like_]").attr('src', unlike_img);
            $("[id^=unlike_]").attr('src', like_img);
        }
        else
        {
            $("#tipid").val(0);
            $("[id^=like_]").attr('src', like_img);
            $("[id^=unlike_]").attr('src', unlike_img);        
        }
    }
    if($(this).attr("id").match(/^unlike_/)!=null)
    {
        if($("#tipid").val()==1)
        {
            $("#tipid").val(0);
            $("[id^=unlike_]").attr('src', like_img);
            $("[id^=like_]").attr('src', unlike_img);
        }
        else
        {
            $("#tipid").val(1);
            $("[id^=unlike_]").attr('src', unlike_img);
            $("[id^=like_]").attr('src', like_img);        
        }
    }
}

$('img').on('click', toggle);

您的問題似乎不夠清楚。 我仍然認為該演示可能會對您有所幫助。