Question

我的问题是关于HTML和Jquery。

我在HTML代码中有一些链接，如下所示：

<a href="#box1">Item1</a>
<a href="#box2">Item2</a>
<a href="#box3">Item3</a>
etc.

在我目前的JQuery脚本中，我有以下代码：

$(function () {
    var targetbox = $('a').attr('href');
    $('a').click(function (event) {
        $(targetbox).fadeIn(2000);
        $('#showtext').text(targetbox);
    });
});

此脚本执行（或最终应该执行的操作）在其中一个隐藏的div（＃box1，＃box2等）中淡出，具体取决于单击的链接（请参阅HTML代码）。我添加了#showtext div来查看属性是否正确存储。

但是，脚本工作正常，只能使用第一个链接中的第一个href属性。我知道$（'a'）。attr（'href'）只抓取第一个'a'元素的属性，并且我需要添加.each到某个地方，但我很遗憾在哪里准确添加它。我尝试在几个地方添加，但它停止了代码的工作。

感谢您的帮助。

吉

Answer 1

由于ID包含在href属性中，this指的是点击的元素，因此您只需访问其属性：

$('a').click(function (event) {
    $(this.getAttribute('href')).fadeIn(2000);
    // or: $($(this).attr('href')).fadeIn(2000);
});

Answer 2

$(function(){
   $("a").click(function(e){
       e.preventDefault(); //avoid applying the hash to the browser (unless desired)
       var href = $(this).attr("href").split("#")[1]; //IE6 will append the URL in front of the hash
       $("#" + href).fadeIn(2000);
   });
});

Answer 3

并不是说我有任何jQuery或其他任何经验（我个人认为它适用于懒惰的程序员），但不应该有类似的东西：

$(function(){ 
    $('a').click(function(event) { 
        var targetbox = $(this).attr('href'); 
        $(targetbox).fadeIn(2000); 
        $('#showtext').text(targetbox); 
    }); 
});

HTML / Jquery：$（'a'）。attr（'href'）和.each？

3 个答案: