使用jquery进行表单元格图像处理

下面是我试图解决的一个有趣的问题：

我有一个表，包含3列和8行。表是通过PHP动态生成的。每个td中都有一个id为1、2或3的按钮，用于标记列。每个按钮有3种状态/样式-正常、单击和悬停（所有不同样式，共9种样式）

到目前为止，我已经通过css为每个分离的单元格提供了普通和悬停样式，并且我创建了一个jquery脚本，将单击单元格的类更改为其单击样式。问题是，当我在一行内设置单元格样式时，我希望该行中剩余的两个单元格恢复为正常样式：

左正常中键单击右正常
左键单击中正常右正常
左正常中正常右键单击

但只在那一排

这是我目前的代码：

function chooseItem(){

var left = $('#table td button#1');
    var middle = $('#table td button#2');
var right = $('#table td button#3');

        left.click(function () {
            $(this).removeClass('LeftNormal');
            $(this).addClass('LeftClicked');        
        })  

        right.click(function () {
            $(this).removeClass('RightNormal');
            $(this).addClass('RightClicked');         
        })  

         midle.click(function () {
            $(this).removeClass('MidleNormal');
            $(this).addClass('MidleClicked');           
        })
};

---

我这里有很多相关的问题，但没有人有类似的问题。提前谢谢你

你想要这样的东西吗

   var $table = $('table');
   $table.find('button').click(function() {
     $(this).addClass('selected').parent().siblings().find('button').removeClass('selected');
   });​

单击以查看实际操作：

试试：

function chooseItem(){

var left = $('#table td button1.left');
    var middle = $('#table td button2.middle');
var right = $('#table td button3.right');

        left.click(function () {
            $(this).closest('tr').find('button').removeClass('LeftNormal');
            $(this).addClass('LeftClicked');        
        })  

        right.click(function () {
            $(this).closest('tr').find('button').removeClass('RightNormal');
            $(this).addClass('RightClicked');         
        })  

         midle.click(function () {
            $(this).closest('tr').find('button').removeClass('MidleNormal');
            $(this).addClass('MidleClicked');           
        })
};

---

你能展示一个简单的，最小的，到目前为止你已经得到了什么吗？我会尝试这样做，但这已经是一个非常简单的问题：）这是唯一让我困扰的事情，整个应用程序要复杂得多，所以我不知道是否要重写整个程序来展示给你看，或者只是给你一个应用程序的链接…？只需显示你所拥有的复制当前问题并试图解决的代码的最小数量。我会想象这是一个表，和一个JavaScript，你正试图用它来显示点击单元格的状态/样式。我将尝试实现你的解决方案。但是您只使用了一个类，我需要为一行中的每个按钮指定一个特定的类。这就是为什么我的按钮有ID。无论如何，非常感谢你，我希望whis能起作用。你为什么需要全部3门课？如果仅仅因为css的原因，你可以检测3种类型：1）默认，2）悬停，3），或者还有另外一个原因使用所有3种？因为我使用完全不同的图像。我不想用我的整个问题来打扰你，因为它很复杂，需要快速解决。因此，我尽力只解释了让我最头疼的一个部分。根据你的建议，我在不久前实施了解决方案（终于找到了一点时间）。非常感谢。我不确定你的修改是否真的有用。我试着按照你的建议去做，但这只会使我现有的代码停止工作。我更改了你的声明，因为我认为它们表明你有重复的ID。尝试将其更改回原处，但请记住，要避免为两个元素提供相同的id，请改用类。代码只是从行中的所有按钮中删除该类，然后将其添加到单击的按钮中。我希望这就是你想要的。