Javascript 表行的切换类

我正在尝试编写一个javascript，它将在onClick事件上切换表行的类，以便我可以使用css来更改它的外观和功能，但是我不太确定如何实现这一点

目标是创建一个表，用户可以在其中选择一行并将其高亮显示，如果用户选择另一行，则上一个选择将返回其原始类。桌子上的行有交替的颜色，我不知道如何让它以我喜欢的方式工作

3个css类是： evn 古怪的 精选

一行只能是以下两项中的一项：

<script>
function toggle(elem) {
  selectClass = 'selected';
  orgClass = document.getElementById(elem).className;
  elem.className = (elem.className == 'selectClass)?orgClass:selectClass;
}
</script>
<table>
<tr class='evn' id=0 name='rowsel' tabindex=0 onClick='toggle(this);'>
  <td>something</td>
  <td>something else</td>
</tr>
<tr class='odd' id=1 name='rowsel' tabindex=0 onClick='toggle(this);'>
  <td>something</td>
  <td>something else</td>
</tr>
<tr class='evn' id=2 name='rowsel' tabindex=0 onClick='toggle(this);'>
  <td>something</td>
  <td>something else</td>
</tr>
</table>

功能切换（elem）{
selectClass='selected'；
orgClass=document.getElementById（elem）.className；
elem.className=（elem.className=='selectClass）？orgClass:selectClass；
}
某物
别的
某物
别的
某物
别的

---

提前感谢。

不要将

odd

或

evn

类替换为选中的

。一个元素可能有1个以上的类，因此添加
selected
类，这样您在选择时可以选择
odd
，而在未选择时只能选择
odd
。在
className
属性上使用
indexOf
，查看元素是否选择了
类。用
+=“选定的”
添加它，用
替换它删除它

请注意，这要求您稍微更改所选
的类定义，但这是完成所需操作的正确方法。
使用jquery进行简单的查询

$("tr").removeClass("selected"); // Removes 'selected' class from all tr element
$("#id2").addClass("selected"); // adds 'selected' class to #id2 element

欲了解更多信息

编辑

不使用jquery，您可以执行如下操作

 function toggle(elem){
  trele=document.getElementById('tblid').getElementsByTagName('TR');
  var classname;
  for(var i=0;i<trele.length;i++)
  {
   classname=trele[i].className;
   trele[i].className=classname.replace("selected","");
  }
  elem.className+=' selected';
 }

功能切换（elem）{
trele=document.getElementById（'tblid'）.getElementsByTagName（'TR'）；
var类名；
对于（var i=0；i我认为您需要：

从以前选择的元素中删除选定的类（如果已设置）
将其添加到当前选择中
像这样的东西可以做到：

    function toggle(elem) {
        var allelems = document.getElementsByClassName( "odd" );
        for (var i = 0; i < allelems.length; i++ )
        {
            allelems[i].className = allelems[i].className.replace( "selected", "" );
        }
        var allelems = document.getElementsByClassName( "evn" );
        for (var i = 0; i < allelems.length; i++ )
        {
            allelems[i].className = allelems[i].className.replace( "selected", "" );
        }

        elem.className += " selected";
    }

功能切换（elem）{
var allegems=document.getElementsByClassName（“奇数”）；
对于（var i=0；i

上面可以大大改进，但是它更像是一个用于说明的伪代码。但是，这确实需要jQuery。@ MaTijn: ToGLCLECAS是棘手的，因为它假设了一个特定的状态并切换它。但是如果你选择一行两次呢？如果AdCudio+Advult= AdvC类，但是ToGLCLECASS+ToGLCLECASS＝0：D@Jochem可以说在这种情况下是否真的要切换；）@Martijn true，但如果我读了这个问题，我认为它并不是真的要切换（我认为代码中的函数名有误导性，或者我误解了这个问题）我没有JQuery的选择不幸的是，我写这篇文章的服务器正在运行一个非常特定的应用程序，可以理解的是，负责它的人不想在服务器上安装任何可能导致问题的附加软件。我不喜欢人们用JQuery答案回答JavaScript问题，所以我把他勾掉了，但Paniyar是对的，如果你使用、、或之类的库，做这样的事情会容易得多（或者至少更简洁），可能值得一看。（这些名称是链接，顺便说一句，所以让链接变得过于微妙、牢骚、咆哮……）