单击链接并将其加载到<div>中

时间:2016-03-25 12:39:30

标签: php html

我有以下代码。

    <?php
/**
 * Created by PhpStorm.
 * User: gary
 * Date: 3/23/16
 * Time: 05:01
 */
?>
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html" xmlns="http://www.w3.org/1999/html"
      xmlns="http://www.w3.org/1999/html">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <meta name="description" content="Default Page">
    <meta name="author" content="Gary Ehrenfeld">
    <link rel="icon" href="favicon.ico">

    <title>Hive Management</title>

    <!-- Bootstrap core CSS -->
    <link href="css/bootstrap.css" rel="stylesheet">
    <link href="css/mystyle.css" rel="stylesheet">
    <script src="js/bootstrap.js"></script>

</head>
<div CLASS="h-banner">
            <h1 class="h1-white">&nbspHive Management</h1>

</div>

<div class="v-banner">
    <div class="col-md-1">
        <h4>
            <ul class="nav nav-pils nav-stacked">
                <li><a href="#" class="h1-white">Profile</a></li>
                <li><a href="#" class="h1-white">My&nbspYards</a></li>
                <li><a href="hives.php" class="h1-white">My&nbspHives</a></li>
                <li><a href="inspections.php" target="content" class="h1-white">Inspections</a> </li>
                <li><a href="#" class="h1-white">Hive&nbspEvents</a></li>
                <li><a href="#" class="h1-white">Harvest</a></li>
                <li><a href="#" class="h1-white">Feeding</a></li>
            </ul>
        </h4>
    </div>
</div>
<div>
    Main Window
</div>

当我点击链接时,我希望该链接在主窗口div中打开,但不知道该怎么做。 我不知道javascript是不是因为我不知道javascript以及如何在php中使用它。

1 个答案:

答案 0 :(得分:1)

您必须使用JavaScript,这是一个简单的例子:

<script>
$(document).ready(function(){
$(".nav li a").on( "click",function (e) {
e.preventDefault();

var page = $(this).attr('href');

$.ajax({
            type: "POST",
            url: page,
            success: function(msg){
                $("#yourdiv").html(msg);
            }
        });
});})
</script>