我在设置一个在div框上显示结果的简单菜单时遇到了困难:
我有一个10个链接的列表,链接到我的服务器上返回数据的PHP文件.我希望这样当观众点击其中一个链接时,来自php文件的数据将显示在屏幕上的div框中,然后当他点击另一个链接时,它将显示来自该php文件的数据在div框中(替换以前的文本).
我知道这很简单,但我不能让它工作.我正在使用jQuery,并想知道你们是否有任何快速的解决方案.
谢谢!!
更新:我几乎失败了javascript代码.但这是框架的基本思想:
<div class="tabs">
<ul class="tabNavigation" style="float:left; padding:1px;">
<li><a href="#displayphpfile">Load phpfile1</a></li>
<li><a href="#displayphpfile">Load phpfile2</a></li>
<li><a href="#displayphpfile">Load phpfile3</a></li>
</ul>
<div id="displayphpfile">
<p>Load phpfile1</p>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
jQuery有一个特定的方法:load().
我会稍微改变你的例子,所以链接的hrefs指向php文件:
<div class="tabs">
<ul class="tabNavigation" style="float:left; padding:1px;">
<li><a href="phpfile1.php">Load phpfile1</a></li>
<li><a href="phpfile2.php">Load phpfile2</a></li>
<li><a href="phpfile3.php">Load phpfile3</a></li>
</ul>
<div id="displayphpfile">
<p>Load phpfile1</p>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
然后代码很简单:
$(document).ready(function() {
$(".tabNavigation a").click(function() {
$("#displayphpfile").load($(this).attr("href"));
return false;
});
});
Run Code Online (Sandbox Code Playgroud)