1

嗨，我有一个 html 片段如下：-

<ul id="userTabs" class="clearfix">

                <li class="selected"><a href="">Profile Home</a></li>

                <li><a href="/test">test</a></li>

                <li><a href="/test2">test2</a></li>

                <li><a href="/test3">test3</a></li>

                <li><a href="/test4">test4</a></li>


    </ul>

我的 jquery 代码片段是-

$("#userTabs li").click(function(e){
  e.preventDefault();
  $("#userTabs li").removeClass('selected');
  $(this).addClass('selected');
  var href = $('li:selected a').attr('href');
  alert(href);

});

现在的问题是，当我单击链接时，我需要获取一个值 o href，上面的代码会将当前选定的类替换为新的选定链接。但我无法获取选定的类 href 值。我在这里想念什么？

4

5 回答 5

4

问题是您在这一行使用了 a:而不是 a .：

var href = $('li:selected a').attr('href');
//              ^-- This should be a . since `selected` is a class name

但是您可以只使用对 的引用来li获取其子a元素，而不是再次遍历整个 DOM：

var href = $(this).children("a").attr("href");

更好的是，您可以将事件处理程序委托给ul效率更高的元素（只有一个事件处理程序，而不是每个li元素一个）：

var tabs = $("#userTabs");
tabs.on("click", "li", function (e) {
    e.preventDefault();
    tabs.children(".selected").removeClass("selected");
    var href = $(this).addClass("selected").children("a").attr("href");
});
于 2012-10-31T08:08:29.083 回答
3

请尝试此代码：

$("#userTabs li").click(function(e){
  e.preventDefault();
  $("#userTabs li").removeClass('selected');
  $(this).addClass('selected');
  var href = $(this).children('a').attr('href');
  alert(href);

});
于 2012-10-31T08:08:51.700 回答
2

试试这个：

var href = $("li.selected a").attr("href");

或者

$("#userTabs li a").click(function(e){
e.preventDefault();
   $("#userTabs li").removeClass("selected");
   $(this).parent().addClass("selected");
   var href = $("li.selected a").attr("href");
   alert(href);
})
于 2012-10-31T08:13:11.590 回答
0

尝试拉取 href 时，您的选择器是错误的，经过测试并且可以按此jsFiddle所示工作

$("#userTabs li").click(function(e){
  e.preventDefault();
  $("#userTabs li").removeClass('selected');
  $(this).addClass('selected');
  var href = $(this).find('a').attr('href');
  alert(href);

});​
于 2012-10-31T08:11:15.123 回答
0

我希望这对你有帮助。使用这个jquery，使用错过的孩子a

$("#userTabs li a").click(function(e){
e.preventDefault();
$("#userTabs li").removeClass('selected');
$(this).addClass('selected');
var href = $(this).attr('href');
alert(href);
});

演示：小提琴

于 2012-10-31T08:14:13.863 回答