如何在不重新加载页面的情况下用php函数替换html div id

问题描述

|| 所以毕竟这里的困惑(我很抱歉) 这就是我的想法,我将在这里重新编写它,并使其清晰,仅用于将来的注释(我知道人们并不需要它),但是就像一个案例研究 我真正想要的就是这个例子
***********************************************
** link1 - link2 - link3 - link4 - link5 **
***********************************************
** content here,here\'s the words **
** content here,here\'s the words **
***********************************************
然后我发现了这样的东西
<ul>
<li><a href=\"page.PHP?link=1\">Link 1</a></li>
<li><a href=\"page.PHP?link=2\">Link 2</a></li>
<li><a href=\"page.PHP?link=3\">Link 3</a></li>
<li><a href=\"page.PHP?link=4\">Link 4</a></li>
<li><a href=\"page.PHP?link=5\">Link 5</a></li>
</ul>
<?PHP
if(!isset($HTTP_GET_VARS[\'link\'])){ 
    $link = 1; 
} else { 
    $link = $HTTP_GET_VARS[\'link\']; 
}

if ($link == 1) {
echo \"<div id=\"player1\"blah blah with video link1\";
} elseif ($link == 2) {
echo \"<div id=\"player2\"blah blah with video link2\"\";
} elseif ($link == 3) {
echo \"<p>Some text about link 3</p>\";
} elseif ($link == 4) {
echo \"<p>Some text about link 4</p>\";
} else {
echo \"<p>Some text about link 1</p>\";
} 
?>
然后@royrui告诉我 解决方案应该是这样的
<?PHP
if(!isset($_GET[\'link\'])){ 
    $ch = 1; 
} else { 
    $ch = $_GET[\'link\']; 
}

if ($link == 1) {
echo \"<div id=\'player1\'blah blah with video link1\'\";
} elseif ($link == 2) {
echo \"<div id=\'player2\'blah blah with video link2\'\";
} elseif ($link == 3) {
echo \"<p>Some text about link 3</p>\";
} elseif ($link == 4) {
echo \"<p>Some text about link 4</p>\";
} else {
echo \"<p>Some text about link 1</p>\";
} 
?>
所以如果你注意到第一件事,我从if
(!isset($HTTP_GET_VARS[\'link\'])){
改变了  至
if(!isset($_GET[\'link\'])){
  在div中所有都是\“,所以我将其更改为\',现在div可以放在echo中 现在每当人们单击链接1时,那个div就会被放置,链接2依此类推。 我知道这是我的困惑问题所在,但是从这里得到的所有帮助我真的很感激。 我想对最佳答案进行投票,但是所有答案都很有用,所以我只是想在第一篇文章中综合起来回答自己 再次感谢!     

解决方法

        
<li><a href=\"page.php?link=1\">Link 1</a></li>
<li><a href=\"page.php?link=5\">Link 5</a></li>
</ul>
<?php
if(!isset($_GET[\'link\'])){ 
    $link = 1; 
} else { 
    $link = $_GET[\'link\']; 
}

if ($link == 1) {
echo \"<div id=\'player1\'>content here,here\'s the words plus html\'video link1\'</div>\";
} elseif ($link == 2) {
echo \"<div id=\'player1\'>content here,here\'s the words plus html\'video link1\'</div>\";
} elseif ($link == 3) {
  ...
} else {
echo \"<p>Some text about link 1</p>\";
} 
?>
    ,        诀窍是您的PHP代码在服务器而不是浏览器上运行。您需要在两端同时运行的代码组合才能完成此任务(称为AJAX)。 以下是一些示例JavaScript代码(无需库)来替换div的内容:
<script type=\"text/javascript\">
var http = false;

if(navigator.appName == \"Microsoft Internet Explorer\") {
  http = new ActiveXObject(\"Microsoft.XMLHTTP\");
} else {
  http = new XMLHttpRequest();
} 

function getLinkText(linkNo) {
  http.open(\"GET\",\"getLinkText.PHP?link=\" + linkNo,true);
  http.onreadystatechange=function() {
    if(http.readyState == 4) {
      document.getElementById(\'divLinkText\').innerHTML = http.responseText;
    }
  }
  http.send(null);
}
</script>

<p><a href=\"javascript:getLinkText(1)\">Link1</a></p>

<div id=\"divLinkText\">
  This will be replaced by the AJAX Call.
</div>
下一步是制作一个PHP页面,该页面返回getLinkText.PHP?link = 1处DIV标记的内容。我会把它留给您,因为您似乎已经失去了那一部分。 正如其他人提到的那样,添加jQuery库使此代码更加紧凑,我建议您这样做。     ,        我正在使用一个名为jquery的javascript库来完成此操作,因为您指定它的方式看起来似乎需要一些AJAX功能。您可以在不使用库的情况下使用javascript进行此操作,但随后必须解决一些浏览器不兼容的问题。 对于此示例,我将假设所有导航项都放在一个id为nav的元素中。 那么您的JavaScript代码应如下所示:
$(\'#nav a\').click(function(){
   $(\'#destinationdiv\').load($(this).attr(\'href\'));
});
php如下所示:首先,制作您的主要php文件,例如page.php或其他文件。
<?php
$secure=true; //This will ensure that users can\'t request any content without this script in between.
$pagenum = (isset($_GET[\'page\'])) ? $_GET[\'page\'] : 1;
require(\'page\'.$pagenum.\'.php\');
?>
现在,您为要提供的内容的每一页添加php文件,它们应该都如下所示:
<?php if(!$secure) die(\"access denied!\"); ?>
<h1>My awesome page content!</h1>
<p>bla bla bla</p>
因此,将它们粘合在一起 在您的服务器上,您应该为希望用户查看的每个页面都有文件。在导航中,您的a标签应具有href标签page.php?page = 1或其他。因此,如果您有一个名为page1.php的文件,然后放入page.php?page = 1,则javascript将阻止该链接实际链接到该文件。取而代之的是,它将向服务器请求一个名为page的get变量,其值为1的page.php。该php脚本现在在服务器上查找一个名为page1.php的php文件,并将其包含在当前脚本中。当PHP完成执行后,输出将发送回浏览器。比我们要求页面的javascript加载函数会将其插入到我们选择的div中。