0

約20行10列のグリッドがあります。

各セルの交差点で、表示したICON画像をクリックし、クリックするたびに一連の3つのグラフィック画像ICONを循環できるようにしたいのですが、必ずしも終了する必要はありません。つまり、クリックしている限り、サイクルを続けることができます。アイコンボタンの存在には120のインスタンスがあります。

これが私のHTMLの抜粋です:

<td class="rights"><img src="../images/button1.png" alt="First of 3 ICONS" class="button" /></td>

対応するCSSはシナリオにとって重要ではありません。

これが私のjQueryの抜粋です:

// jQuery Functions
$(document).ready(function() {
    // Toggle ICONS
    $('img.button').click(function(){
        if ($(this).attr('src') == '../images/button1.png') $(this).closest('img.arcButton').attr('src', '../images/button2.png');
        else if ($(this).attr('src') == '../images/button2.png') $(this).closest('img.arcButton').attr('src', '../images/button3.png');
        else if ($(this).attr('src') == '../images/button3.png') $(this).closest('img.arcButton').attr('src', '../images/button1.png');
    }); // end Toggle ICONS
}) // end jQuery Functions

私のアイコンはbutton1.png、、、button2.pngbutton3.png

助けてくれてありがとう

4

1 に答える 1

0

これが、私が試して、テストして、動作するようになったjQueryソリューションです。

    if ($(this).attr('src') == '../images/button1.png') $(this).closest('img.arcButton').attr('src', '../images/button2.png');
    else if ($(this).attr('src') == '../images/button2.png') $(this).closest('img.arcButton').attr('src', '../images/button3.png');
    else if ($(this).attr('src') == '../images/button3.png') $(this).closest('img.arcButton').attr('src', '../images/button1.png');
于 2013-02-21T20:16:17.747 に答える