繁体   English   中英

在PHP中进行编程以使用Ajax在旧页面的div中加载新页面

[英]programming in php to load a new page inside a div of old page using ajax

<!doctype html>
<head>
 <title>Home Page</title>
 <style>
  #header{background-color:#09C; width:100%; height:100px;}
   #logoandsearch{background-color:#603; width:400px; height:40px; float:left; margin-top:30px; margin-left:10px; float:left;}
    #logo{background-color:#663; width:200px; height:40px; float:left;}
    #search{width:200px; height:40px; float:right;}
   #headerlinks{background-color:#06F; width:550px; height:40px; margin-top:30px; margin-right:40px; float:right;}
    .hl{width:110px; height:40px; float:left;}
    .hl:hover{background-color:#0C3;}
   #leftdiv{background-color:#F33; width:200px; height:500px; float:left}
    #profile{background-color:#603; width:200px; height:300px; float:left;}
    #profilespace{background-color:#FFF; width:200px; height:10px; float:left;}
    #notification{background-color:#363; width:200px; height:30px; float:left;}
   #middlediv{background-color:#303; width:900px; height:500px; float:left;}
 </style>
 <script>
 function clic()
  {
      var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("middlediv").innerHTML=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","notification.php",true);
xmlhttp.send();
  }
</script>
</head>
<body>
 <div id="maindiv">
  <div id="header">
    <div id="logoandsearch">
     <div id="logo">    
     </div>
     <div id="search">
      <form>
       <input type='text' placeholder='Type a Name' style="width:200px; height:35px; float:right;">
      </form>    
     </div>   
    </div>
   <div id="headerlinks">
    <div id="headerlinks1" class="hl">
     <a href="#" style="margin-left:30px; text-decoration:none; line-height:40px; font-size:20px; color:#FFF;">Home</a>
    </div>
    <div id="headerlinks2" class="hl">
     <a href="#" style="margin-left:29px; text-decoration:none; line-height:40px; font-size:20px; color:#FFF;">Inbox</a>
    </div>
    <div id="headerlinks3" class="hl">
     <a href="#" style="margin-left:25px; text-decoration:none; line-height:40px; font-size:20px; color:#FFF;">Outbox</a>
    </div>
    <div id="headerlinks4" class="hl">
     <a href="#" style="margin-left:23px; text-decoration:none; line-height:40px; font-size:20px; color:#FFF;">Settings</a>
    </div>
    <div id="headerlinks5" class="hl">
     <a href="userregister.php" style="margin-left:26px; text-decoration:none; line-height:40px; font-size:20px; color:#FFF;">Logout</a>
    </div>
   </div>
  </div>
  <div id="leftdiv">
   <div id="profile">
   </div>
   <div id="profilespace">
   </div>
   <div id="notification">

     <a href="homepage.php" style="font-size:28px; text-decoration:none; margin-left:30px; onClick="clic()">Notification</a>

   </div>
  </div>
 </div>
 <div id="middlediv">

 </div>
</body>
</html>

这是我的第一页,我要在第一页的名为“ dividual div”的div中加载名为notification.php的第二页。 我的第一页的名称是homepage.php

下面给出的代码是我的notification.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>notification</title>
</head>
<body>
<?php
include "db.php";
 session_start();
 if($_SESSION['login_user']==$_SESSION['mail'])
  {
    $mail=$_SESSION['mail'];

    $query=mysql_query("select notification from notification where email='$mail' order by id desc");

    while($row= mysql_fetch_array($query))
       {  
        echo '<div id="notificationdiv" style="background-color:#CFC; width:100%; height:30px">'.$row['notification'].'</div>'.'<br>'; 
       }

  }
  else
   {
    $lu=$_SESSION['login_user'];
    $query2=mysql_query("select notification from notification where email='$lu' order by id desc");
    while($row2= mysql_fetch_array($query2))
       {  
        echo '<div id="notificationdiv" style="background-color:#CFC; width:900px; height:500px">'.$row2['notification'].'</div>'.'<br>'; 
       }   
   }

?>


</body>
</html>

请帮助我是php和ajax的新手。

在Web浏览器中执行notification.php,并在浏览器中检查结果。 如果它正在回显您想要的输出?

自从您标记了JQuery以来,如何使用JQuery .load()函数进行测试。

链接: http//api.jquery.com/load/

更改此:

<a href="homepage.php" style="font-size:28px; text-decoration:none; margin-left:30px; onClick="clic()">Notification</a>

通过:

<a href="#" style=font-size:28px; text-decoration:none; margin-left:30px; onClick="clic()">Notification</a>

此外,它应消除以下形式中的引号:style =

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM