Question

毕竟在这里混淆了（我道歉）

这里是我的想法，我将在这里重新编写并清楚地表明未来的笔记（我知道人们不会真的需要这个）但是那样就像一个案例研究

我真正想要的就是这个例子

***********************************************
** link1 - link2 - link3 - link4 - link5 **
***********************************************
** content here, here's the words **
** content here, here's the words **
** content here, here's the words **
** 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>";
} 
?>

所以如果你注意到我改变了(!isset($HTTP_GET_VARS['link'])){的第一件事到if(!isset($_GET['link'])){ 所有它都是“所以我把它改成'，现在div可以放在echo中

现在，每当人们点击链接1时，那个div就会被放置，而2则依旧等等。

我知道这是混乱问题的问题，但我非常感谢你们的帮助。

我想投票给出最好的答案，但所有这些都很有用所以我只是想在第一篇文章中一起回答自己

再次感谢！

Answer 1

我正在使用一个名为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>

所以，将它们粘在一起在您的服务器上，您应该拥有希望用户能够查看的每个页面的文件。在导航中，您的标签应该有一个href标签page.php？page = 1或者其他什么。因此，如果您有一个名为page1.php的文件，然后将page.php？page = 1，则javascript将阻止该链接实际链接到该文件。相反，它会向你的服务器请求一个带有一个名为page的get变量的page.php，值为1. php脚本现在在服务器上查找一个名为page1.php的php文件，并在当前脚本中包含该文件。当PHP完成执行时，输出将被发送回浏览器。比我们调用请求页面的javascript加载函数将它插入到我们选择的div中。

Answer 2

诀窍是你的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库会使这段代码变得更紧凑，我推荐它。

Answer 3

<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函数替换html div id

3 个答案: