Question

我是javascript的新手，我已经尝试了几个小时来使这个fadeIn功能起作用。

首先，看看我的code here。

我还在标题中包含以下内容：

<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>

这就是我希望页面工作的方式，

当用户进入网站时，主页选择将淡出
该菜单基于类别的<ul>和<li>个主题，在每个类别中我们都有不同的合作。每个类别都有一个<a href="category-id">，每个公司都有一个<a href='company-id'>到div标签，后面是正文。
用户应该能够在菜单选项之间切换，并且每次都应该淡入时间。

因此，您在我的代码中看到的问题是，它适用于页面加载，但我无法从菜单中选择任何内容。

任何建议都会有所帮助

Answer 1

如果我理解正确，你希望它的功能如下：

$('#menu a').click(function () {
    $("#content div").hide(); //Hide all content
    var id = $(this).attr('href');
    $(id).fadeIn(); // Show content for current tab
});

你不需要这一行（它正在删除id）：

$("#menu li").attr("href", ""); //Reset id's

这是我甚至不知道它的用途：

$(this).parent().attr("href", "current"); // Activate this google parent!

如果要将类添加到当前活动菜单项，请使用类似

的内容

$(this).parent().addClass('active');

此外，您不需要添加“＃”，因为您已经拥有了#ref atrribute：

$($(this).attr('href')).fadeIn(); // Show content for current tab

您可以通过提醒或记录来检查您获得的ID类型：

var id = $(this).attr('href');
alert(id);
$(id).fadeIn();

Answer 2

您正在重置＆＃34; href＆＃34;属性。因此，当你试图淡化＆＃34; href＆＃34;属性值更改为＆＃34;当前＆＃34;。

这两行：

$("#menu li").attr("href", ""); //Reset id's
....
$('#' + $(this).attr('href')).fadeIn();

是错误的，因为$（this）.attr（＆＃39; href＆＃39;）等于＆＃34;＆＃34; （空字符串）

你犯了一个错误，因为你做了

$("#content div:last").fadeIn(); // Show first tab content

但是命令和你期望的并不一致。在这里，您在最后一个选项卡内容而不是第一个选项卡上使用fadeIn。

你可以尝试这样的事情：http://jsfiddle.net/546Jn/4/

$(document).ready(function () {
    $("#content div").hide();
    $("#content div:first").fadeIn(); // Show first tab content

    $('#menu a').click(function () {
        $("div#content div").hide(); // Hide all pages
        $('div' + page).fadeIn(); // Show content for current tab
    });
});

Answer 3

你确定使用这行代码吗？ $("#menu li").attr("href", "");

您不会在此处覆盖您的ID。你删除你的链接href。

单击时，Javascript fadeIn div标签失败

3 个答案: