0

我正在使用以下 jQuery 尝试淡出 div,加载 HTML 页面,然后淡入。淡入工作正常,但似乎没有加载 HTML,我不太确定是什么我迷路了。第一个功能是尝试在最初访问该站点时将我的第一页加载到 div 中。

jQuery

$(document).ready(function() {

    $("#Content").load("Landing.html");

});

$(document).ready(function() {

    $("a").click(function(event){
        event.preventDefault();
        linkLocation = this.href;
        $("#Content").fadeOut(500);  
        $("#Content").load("linkLocation"); 
        $("#Content").fadeIn(500); 
    });

});

HTML的基本思想

<ul>
        <li>
          <a href="Contact.html">contact</a>
       </li>  

       <li>
          <a href="Portfolio.html">portfolio</a>
       </li>

        <li>
          <a href="Services.html">services</a> 
        </li> 

       <li>
          <a href="About.html">about</a>
       </li>

       <li>
          <a href="Landing.html">home</a>
       </li>      
     </ul>

<div id="Content"></div>

谢谢你的帮助!

编辑

感谢所有的建议。我已经尝试了它们中的每一个,但仍然没有运气。我一定错过了一些非常简单的东西,但我只是看不到它 ATM。

4

2 回答 2

0

linkLocationlocation 是一个变量而不是字符串,因此不应包含在""

$(document).ready(function() {

    $("a").click(function(event){
        event.preventDefault();
        var linkLocation = this.href;
        $("#Content").fadeOut(500);  
        $("#Content").load(linkLocation ); 
        $("#Content").fadeIn(500); 
    });

});
于 2013-06-19T03:16:34.200 回答
0

为了获得最佳结果,您应该链接调用以确保在另一个触发之前完成一个调用:

  $("#Content").fadeOut(500, function () {
        $("#Content").load(linkLocation, function () {
            $("#Content").fadeIn(500)
        });
    });

是的,按照上面的建议修复链接属性问题。

于 2013-06-19T03:52:33.677 回答