使用 .click 切换 jQuery .load答案

【问题标题】：Toggle jQuery .load with .click使用 .click 切换 jQuery .load
【发布时间】：2013-07-09 15:15:44
【问题描述】：

嘿，我有一个 div content，我想将外部 html 文件加载到其中。当我点击导航中的链接时：

        <div class="nav">
            <div class="logo">
                <strong>
                    <a href="index.html">
                        <img src="images/logo.png" alt="Sam Jarvis logo"/>
                    </a>
                </strong>
            </div>
            <div class="menu">
                <ul>
                    <li><a href="#home">HOME</a></li>
                    <li><a href="#about">ABOUT</a></li>
                    <li><a href="#work">PORTFOLIO</a></li>
                    <li><a href="#clients">CONTACT</a></li>
                </ul>
            </div>  
        </div>

我想在每个链接中淡入一个外部 html 文件。如果我点击主页，index.html 淡入。如果我点击另一页，前一页淡出，新一页淡入。

我不确定为什么我当前的链接没有弹出警告框。如何在我的菜单 ul 中使用 jQuery 定位单个链接？

jQuery:

<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<!-- SCRIPTS -->
<script type="text/javascript">
     $(document).ready(function(){
          $(".menu ul li a").click(function(){
                alert("Execute");
          });
     });
</script>

【问题讨论】：

哎呀，已编辑，谢谢。

标签： jquery html load click

【解决方案1】：

它不起作用，因为您包含 jQuery Migrate，而不是 jQuery。尝试使用

http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js

当您包含 jQuery 时，它可以正常工作：jsFiddle example

jQuery Migrate 是一个 jQuery 插件，可帮助您将旧代码更新为新版本的 jQuery。

【讨论】：

【解决方案2】：

您未能添加jQuery 引用。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<!-- SCRIPTS -->
<script type="text/javascript">
     $(document).ready(function(){
          $(".menu ul li a").click(function(){
                alert("Execute");
          });
     });
</script>

【讨论】：