Question

由于您的大多数网页都是使用HTML5构建的，因此我一直在寻找一种方法将内容从其他来源加载到我的内容框中（就像以前一样，您需要使用php包含）。

所以我有一个index.html，我从其他来源加载内容。

我的菜单是一个包含几个链接的列表：

<nav class="links">
                        <ul>
                            <li><a href="index.html">Link1</a></li>
                            <li><a href="index.html">Link2</a></li>
                            <li><a href="index.html">Link3</a></li>
                            <li><a href="index.html">Link4</a></li>
                        </ul>
                    </nav>

通常我将内容加载到：

<script>
        $(document).ready(function(){
            $("#content").load("content1.html");
        });
    </script>

如何根据链接加载不同的content.html页面？基本上它是如何包含在PHP？我想将内容加载到

中

<div id="content"></div>

感谢您的帮助！

Answer 1

您可以通过制作if else条件语句来完成此操作。因此，我将点击链接的href值放在link variable中，然后有条件地您可以更改内容加载。：）

＆＃13;

        $(document).ready(function(){
            $(".links ul li a").click(function(){

                var link=$(this).attr("href"); //This here will do the trick :)

                if(link=="index.html"){ 
                    alert("load content 1"); //$("#content").load("content1.html");
                }
                else if(link=="contact.html"){
                    alert("load content 2"); //$("#content").load("content2.html");
                }
                else if(link=="about.html"){
                    alert("load content 3"); //$("#content").load("content3.html");
                }
            })
          });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<nav class="links">
        <ul>
           <li><a href="index.html">Link1</a></li>
           <li><a href="contact.html">Link2</a></li>
           <li><a href="about.html">Link3</a></li>
        </ul>
    </nav>

＆＃13;

jquery ajax：从菜单链接加载内容

1 个答案: