Question

我正在尝试编写一个jquery函数，但对jquery来说是全新的。这是我非常简单的函数，我希望清除除了所选链接之外的所有未选定类的链接：

$(function() 
{
    $('li a').click(function()
    {
        $('li a').addClass('unselected');
    $(this).addClass('selected');


    });


});

我该怎么做？然后我如何取消选择除具有特定名称属性的所有内容之外的所有内容？以下是链接示例：

<li><a id="106" name="wavelength" href="#">10.6 &micro;</a></li>... set of links

和另一组链接

<li><a id="10watt" name="power" href="#">10 watt</a></li>....

Answer 1

$(function() {
  var $a = $('li a');
  $a.click(function() {
    $a.removeClass('selected').not(this).addClass('unselected');
    $(this).addClass('selected');
  });
});

如果您要定位具有特定名称的链接，可能的选择器之一是a[name='somenamehere']。

在这个例子中，这就足够了：
$a.filter("[name='somenamehere']")
（您可能希望以不同的方式实现属性选择器，具体取决于您要执行的操作）

此外，如果你取消了“未选择”的课程，这可能是一个好主意。我假设你正在使用它来造型。如果是这样，给所有链接一个样式，然后在原始样式之上给出.selected链接样式：


.menu a, .menu a:visited {
  color: #FF0000;
  text-decoration: none;
}

.menu a.selected {
  font-weight: bold;
}

Answer 2

回应您对其他答案之一的评论（现已删除）：

这些标签分为五列。如何取消选择列中的那些，同时选择其他列？我已使用带有名称属性的链接标记了它们

您可以将<li>链接按其中包含的<ul>进行分组！

您可以使用jQuery在<a>的父母中搜索.closest('ul')，然后在.find('li a')内搜索：{/ p>

// best practice says you should cache the result of this search 
// so you don't need to find it again
var $links = $('li a');
// attach a click function to the links
$links.click(function() {
  // again cache it... we will use it more than once.
  var $this = $(this); 

  // remove selected from everything - add unselected
  $this.closest('ul').find('li a').removeClass('selected').addClass('unselected');
  // remove unselected from this link and add selected
  $this.removeClass('unselected').addClass('selected');
});

由于您说链接组共享name属性，请查看此代码：

var $links = $('li a');
$links.click(function() {
  // store ourself as a jquery object, and get our name:
  var $this = $(this), myname = $this.attr('name');

  // filter $links to obtain the ones that share myname:
  $links.filter(function() {
    // we can use the DOM element "this.name" instead of $(this).attr('name')
    // to save some time here:
    return this.name == myname;
  }).removeClass('selected').addClass('unselected');

  $this.removeClass('unselected').addClass('selected');
});

如果找到具有特定名称属性的属性，请查看Attribute Equals Selector，如下所示：

$('li a[name=wavelength]');

Answer 3

你几乎就在那里...... :)试试这个：

    $(function()  
{ 
    $('li a').click(function() 
    { 
        $("li a[name!='wavelength']").addClass('unselected'); 
                $(this).removeClass('unselected'); 
                $(this).addClass('selected'); 
    }); 
});

JS新手需要Jquery的帮助

3 个答案: