我正在尝试根据用户点击的链接在 div 中加载 PHP 文件。我希望内容仅在该 div 中刷新,而不是整个页面。
我的index.php 文件如下所示:
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<a class="navbar-brand" id="allrepos" href="#">GitHubAPI</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<?php
if(isset($_SESSION['userid']))
{
echo '
<li class="nav-item active">
<a class="nav-link" href="#">Hello, '.$_SESSION['username'].'!</a>
</li>
<li class="nav-item active dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
My repositories
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" id="myrepos" href="#">All repositories</a>
<a class="dropdown-item" id="mybookmarked" href="#">Bookmarked repositories</a>
</div>
</li>
<li class="nav-item active dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Profile
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="#">Create team</a>
<a class="dropdown-item" href="#">View teams</a>
<div class="dropdown-divider"></div>
<a href="github/logout.php" class="dropdown-item">Logout</a>
</div>
</li>';
}
else
{
echo
'<li class="nav-item active">
<a class="nav-link" href="https://github.com/login/oauth/authorize?client_id=">
Login
</a>
</li>';
}
?>
</ul>
</div>
</nav>
<div id="repositories">
<?php include 'repositories.php'; ?>
</div>
<script type="text/javascript">
$(document).ready(function(){
$("#allrepos").click(function() {
$("#repositories").load('repositories.php');
return false;
})
});
$(document).ready(function(){
$("#myrepos").click(function() {
$("#repositories").load('myrepositories.php');
return false;
})
});
$(document).ready(function(){
$("#mybookmarked").click(function() {
$("#repositories").load('mybookmarkedrepos.php');
return false;
})
});
</script>
当index.php加载时,我希望加载repositories.php,然后通过单击链接来更改id为“repositories”的div中显示的内容。
目前,当我单击任何链接时,没有任何反应。
谢谢!
最佳答案
仅就这件事而言,你不需要在这里,你也可以通过 php 来完成。这是一个如何完成此操作的示例。 希望这会对您有所帮助。
<a href="index.php?page=about"> about </a>
<a href="index.php?page=contact"> contact </a>
<a href="index.php?page=service"> service </a>
<a href="index.php?page=shope"> shop </a>
<?php
if(isset($_GET['page'])
{
if($_GET['page'] == "about")
include'about.php';
else if($_GET['page'] == "contact")
include'contact.php';
else if($_GET['page'] == "service")
include'service.php';
else if($_GET['page'] == "shope")
include'shope.php';
}
?>
关于javascript - 单击 <a> 标签时加载 div 内的 PHP 文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54143182/