我知道有一些类似这样的文章，但我无法弄清楚。 附：我是编程新手所以也许我的问题很愚蠢。
我不想做的就是用可点击的按钮（button1，button2，button3，button4）更改标签内的4个内容
页面加载时，用户只能看到content_1.php。
<div id="content_box">
<?
include 'content_1.php';
include 'content_2.php';
include 'content_3.php';
include 'content_4.php';
?>
</div>
也许有人可以展示一个例子？
感谢。
答案 0 :(得分：2)
使用ajax请求，以供链接下面的参考使用：
答案 1 :(得分：1)
还有更多解决方案，但最简单的是，如果你创建了四个链接，如：
<a href="?content=1">show content 1</a>
然后在PHP端通过此用户输入创建逻辑：
<div id="content_box">
<?php
switch($_GET['content']){
case 1: include 'content_1.php'; break;
case 2: include 'content_2.php'; break;
case 3: include 'content_3.php'; break;
case 4: include 'content_4.php'; break;
default: include 'content_1.php';
?>
</div>
顺便说一下，建议不要使用<? ?>短标签，因为配置不支持任何地方。
答案 2 :(得分：1)
要做到这一点，你需要使用一些javascripts，但不是发明你自己可能更好地使用存在的东西。试试这个http://jqueryui.com/demos/tabs/这应该是你需要的。之后，您可以使用ajax请求使用户只加载他需要的部分
祝你好运！答案 3 :(得分：1)
您可以（A）将其全部发送到客户端并完全在客户端进行隐藏和显示，或者您可以（B）发送第一个内容块并按需加载其余内容（通过AJAX） ）。
在两者之间进行选择时，需要考虑以下几点：
include - PHP文件是否有副作用（它不应该！）（是→B：仅包括所请求的内容）至于第一个策略，您可以：
<script type="text/javascript">
function show(box) {
for (var i = 1; i <= 4; i++) {
document.getElementById('content_' + i).style = (i === box ? 'block' : 'none');
}
}
</script>
<div id="content_box">
<div id="content_1"><?php include 'content_1.php'; ?></div>
<div id="content_2" style="display: none;"><?php include 'content_2.php'; ?></div>
<div id="content_3" style="display: none;"><?php include 'content_3.php'; ?></div>
<div id="content_4" style="display: none;"><?php include 'content_4.php'; ?></div>
</div>
<a href="#" onclick="show(1);">Show #1</a>
<a href="#" onclick="show(2);">Show #2</a>
<a href="#" onclick="show(3);">Show #3</a>
<a href="#" onclick="show(4);">Show #4</a>
<强>注意
这假设交互必须在同一页面上。如果需要整页加载，请使用GET parameters and a PHP switch。
答案 4 :(得分：1)
我认为不是“纯粹的”AJAX（这也很好，但它的代码有点冗长而且不那么容易理解）你应该使用jQuery的AJAX API以简单的方式实现相同的功能。
例如，要加载文件，您应该使用jQuery的 load() 功能。
更具体地说，在您的代码中，它看起来像这样：
$('#content_box').load('content_1.php');
但我想展示一个完整的例子，它也适用于没有JavaScript或禁用JS的浏览器，因为它也理解$ _GET参数。有三种解决方案：1。选择和选项标签，2。按钮，3。单选按钮。
所以代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Load contents with jQuery</title>
<!-- jQuery CDN: http://docs.jquery.com/Downloading_jQuery#CDN_Hosted_jQuery -->
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.2.min.js"></script>
<!-- The code with jQuery -->
<script type="text/javascript">
$(document).ready(function(){
$('#change_content_select').submit(function(){
var which_to_load = $('#sel_number').val(),
source_of_file = 'data/content_'+which_to_load+'.php';
$('#content_box').load( source_of_file );
return false;
});
$('#button_1, #button_2, #button_3, #button_4').click(function(){
var which_to_load = ( $(this).attr('id')+"" ).replace('button_', ''),
source_of_file = 'data/content_'+which_to_load+'.php';
$('#content_box').load( source_of_file );
return false;
});
$('#change_content_radio').submit(function(){
if( $('input[name=nrOfPage]:checked').val() === undefined ){
alert('Select which page to load first...');
return false;
}
var which_to_load = $('input[name=nrOfPage]:checked').val(),
source_of_file = 'data/content_'+which_to_load+'.php';
$('#content_box').load( source_of_file );
return false;
});
});
</script>
</head>
<body>
<!-- Let's do it with select tags -->
<div id="content_changing_select_tag">
<b>Page to load with select:</b><br />
Which page would you like to load?
<form method="get" id="change_content_select" action="">
<p>
<select id="sel_number" name="nrOfPage">
<option value="1">1st page</option>
<option value="2">2nd page</option>
<option value="3">3rd page</option>
<option value="4">4th page</option>
</select>
<!-- We put this submit button for compatibility with browsers with JavaScript disabled -->
<input type="submit" value="Change content" />
</p>
</form>
</div>
<hr />
<!-- Let's do it with buttons -->
<div id="content_changing_buttons">
<b>Page to load with buttons:</b><br />
Which page would you like to load?
<form method="get" id="change_content_buttons" action="">
<p>
<input value="1" type="submit" id="button_1" name="nrOfPage" />
<input value="2" type="submit" id="button_2" name="nrOfPage" />
<input value="3" type="submit" id="button_3" name="nrOfPage" />
<input value="4" type="submit" id="button_4" name="nrOfPage" />
</p>
</form>
</div>
<hr />
<!-- Let's do it with radio buttons -->
<div id="content_changing_radio">
<b>Page to load with radio:</b><br />
Which page would you like to load?
<form method="get" id="change_content_radio" action="">
<p>
<input type="radio" name="nrOfPage" value="1" />
<input type="radio" name="nrOfPage" value="2" />
<input type="radio" name="nrOfPage" value="3" />
<input type="radio" name="nrOfPage" value="4" />
<!-- We put this submit button for compatibility with browsers with JavaScript disabled -->
<input type="submit" value="Change content" />
</p>
</form>
</div>
<hr />
<div>OK, here comes the content...</div>
<div id="content_box">
<?php
// default number of page to load
$defaultPageNumber = '1';
// check if content number is set
$numberOfPageToInclude = isset($_GET['nrOfPage']) ? $_GET['nrOfPage'] : $defaultPageNumber;
$options = array(
'options' => array(
'min_range' => 1,
'max_range' => 4,
));
if (filter_var($numberOfPageToInclude, FILTER_VALIDATE_INT, $options) !== FALSE) {
include 'data/content_' . $numberOfPageToInclude . '.php';
} else {
echo '<span style="color:red;">Wrong page number, including default page!</span><br />';
include 'data/content_1.php';
}
?>
</div>
</body>
</html>
要包含的文件示例：
content_1.php ：
<h1>This is content <span style="color:red;font-size: 125%;">1</span>!</h1>
content_2.php ：
<h1>This is content <span style="color:red;font-size: 125%;">2</span>!</h1>
content_3.php ：
<h1>This is content <span style="color:red;font-size: 125%;">3</span>!</h1>
content_4.php ：
<h1>This is content <span style="color:red;font-size: 125%;">4</span>!</h1>
询问是否有不清楚的事 希望能帮助别人！
（顺便说一下。 TESTED 和 工作 。）