Question

我有......

HTML：

<a href="#" class="link" id="1">Link 1</a>
<a href="#" class="link" id="2">Link 2</a>

<div id="page1" class="page">1</div>
<div id="page2" class="page">2</div>

javascript（jquery）：

$("a[class='link']").click(function() {
        var num = $("a[id]");
        $('#page' + num).fadeIn();
});

我想要做的是在点击链接时有一个特定的div淡入淡出。因此，如果您单击ID为“1”的链接1，我希望ID为＃page1的div为fadein。

Answer 1

$("a.link").click(function() {
        var num = $(this).attr("id");
        $('#page' + num).fadeIn();
});

仅供参考：以数字开头的HTML ID在技术上无效。

Answer 2

$("a.link").bind('click', function(){
    var id = $(this).attr('id');
    $('#page' + id).fadeIn('fast'); 
});

Answer 3

你非常接近：

$("a[class='link']").click(function() {
    var num = $(this).attr('id');
    $('#page' + num).fadeIn();
});

Answer 4

查看jQuery docs。

您在这里要做的是访问元素的属性。你应该这样做：

var num = $(this).attr('id');

Answer 5

一种方式：

$('a').click(
    function(){
        var divInd = ($(this).index() + 1);
        $('div').fadeOut(
            function(){
                $('#page' + divInd).fadeIn();
            });
        return false;
    });

JS Fiddle

另请注意，HTML 4下的id无法使用数字启动。如果是，则html无效。虽然html5更宽松，更宽松，但请记住使用<!DOCTYPE html>（html5）doctype。

使用id来lin

5 个答案: