我有一个大约 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
感谢您的帮助