在加载页面上,在div中显示一个PHP文件,然后单击显示同一div中的其他PHP文件

时间:2016-02-14 18:59:06

标签: javascript php jquery

我想在加载页面时显示PHP文件,并在同一个div中显示其他PHP文件。这是我的代码......

<ul id="nav" class="nav">
   <li><a class="ajax-link" href="menu.php">Menu</a></li>
   <li><a class="ajax-link" href="#">History</a></li>
   <li><a class="ajax-link" href="editdetails.php">Details</a></li>
   <li class="last"><a href="logout.php">Logout</a></li>
</ul> <!-- end #nav -->

<div class="page" id="main_content">
   <script type="text/javascript">
     $(function() {
       $("a.ajax-link").on("click", function(e) {
         e.preventDefault();
         $("#main_content").load(this.href);
       });
     });
    </script>
</div>

此代码仅在点击后显示页面,但我想在加载时显示菜单页面。帮助我。

2 个答案:

答案 0 :(得分:1)

<ul id="nav" class="nav">
    <li><a class="ajax-link" href="menu.php">Menu</a></li>
    <li><a class="ajax-link" href="#">History</a></li>
    <li><a class="ajax-link" href="editdetails.php">Details</a></li>
    <li class="last"><a href="logout.php">Logout</a></li>    
</ul> <!-- end #nav -->

<div class="page" id="main_content"></div>

<script type="text/javascript">
    //It will load content once your page get load
    $(document).ready(function(){
         $("#main_content").load('MENU_LINK');
    });

    //It will load on clicking of links
   $("a.ajax-link").on("click", function(e) {
         e.preventDefault();
         $("#main_content").load(this.href);
   });        
</script>

答案 1 :(得分:0)

试试这个:

<html>
    <head>
        <!-- Jquery -->
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
        <script>
        $(document).ready(function(){
             $("#main_content").load('http://your.link/');
        });        
        </script>
    </head>
    <body class="">
        <ul id="nav" class="nav">
            <li><a class="ajax-link" href="menu.php">Menu</a></li>
            <li><a class="ajax-link" href="#">History</a></li>
            <li><a class="ajax-link" href="editdetails.php">Details</a></li>
            <li class="last"><a href="logout.php">Logout</a></li>
        </ul>

        <div class="page" id="main_content"></div>

    </body>
</html>

希望这会有助于你:)