0

我有一个大约 20 行和 10 列的网格。

在每个单元格交叉点中,我希望能够单击已显示的 ICON 图像,并能够在每次单击时循环浏览一系列 3 个图形图像 ICON,而不必结束。换句话说,只要我点击,循环就可以继续。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.png, 和button3.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 回答