Question

我有一个大约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

我的ICON是button1.png，button2.png和button3.png

感谢您的帮助

Answer 1

这是我可以使用，测试并开始工作的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');

如何通过jQuery click（）函数在ICON按钮上循环一系列

1 个答案: