改变颜色的一个选择的链接，是埋在一个表

StackOverflow https://stackoverflow.com/questions/256093

  •  05-07-2019
  •  | 
  •  

题

我试图使用类名称的改变颜色的链路后，它已选择，因此，它仍将是新的颜色，但是直到另一个链接选，然后将它改回来。

我使用这个代码发布由马丁*库尔在 此 问题：

<html>     
<head>
<script>
  document.onclick = function(evt) {
    var el = window.event? event.srcElement : evt.target;
    if (el && el.className == "unselected") {
      el.className = "selected";
      var siblings = el.parentNode.childNodes;
      for (var i = 0, l = siblings.length; i < l; i++) {
        var sib = siblings[i];
        if (sib != el && sib.className == "selected")
          sib.className = "unselected";
      }
    }
  }
</script>
<style>
  .selected { background: #f00; }
</style>
</head>
 <body>
   <a href="#" class="selected">One</a> 
    <a href="#" class="unselected">Two</a> 
    <a href="#" class="unselected">Three</a>
  </body>

它工作得很好直到我尝试出了链接在一个表中。为什么是这?是容易的，我是个初学者。

没有错误的联系正在改变的"选择"类，但当另一个链接选，老链接，保持"选择"类，而不是更改为"未被选中的".基本上，我可以告诉，它的职能，像一个信息科技公司的属性，它是不是我要去的。

是的，的联系都在不同的细胞，你会如何建议改变的代码，以便它能够正常工作?

好的，实际上，我讲太快了。

document.onclick = function(evt)
{
var el = window.event? event.srcElement : evt.target;
if (el && el.className == 'unselected')
{
    var links = document.getElementsByTagName('a');
    for (var i = links.length - 1; i >= 0; i--)
    {
            if (links[i].className == 'selected')
                    links[i].className = 'unselected';
    }
    el.className = 'selected';
}

return false;
}

这个代码你给我的伟大工程，在视觉上，这正是我想要它做的。但是，它使我的链接停止工作...他们改变颜色，但还链接到任何东西，然后当我删除脚本，他们的工作的罚款。我做错了/我有什么改变，以使这项工作？

此外，我想做同样的事情在其他地方，在我的网站的链接都中的一个 <div> 标记中，通过分离 <p> 标记。我如何可以使这项工作？

有帮助吗？

解决方案

你的循环过的兄弟姐妹。如果链接是在单独的 <td>'s然后他们就不再是兄弟姐妹。

你可以通过循环所有环节是这样的：

document.onclick = function(evt)
{
    var el = window.event? event.srcElement : evt.target;
    if (el && el.className == 'unselected')
    {
        var links = document.getElementsByTagName('a');
        for (var i = links.length - 1; i >= 0; i--)
        {
            if (links[i].className == 'selected')
                links[i].className = 'unselected';
        }
        el.className = 'selected';
    }

    return false;
}

我也加入 return false; 在结束功能阻止你去'#'

其他提示

是否有错误或是有没有什么事？一个良好的第一步，如果你是一个javascript初是使用的工具像萤火虫，所以你看到详细的错误消息，并且可以添加在控制台。日志语句看看发生了什么事情，而你跑你的代码。

通过'表中的'做你的意思是把每个链路在其自己的细胞？因为这将使这一行：

var siblings = el.parentNode.childNodes;

不选择其他的链接以外的细胞。你会找到另一种方式的信号的其元件的链接容器。

许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top