我想问一下如何在一个div中打开不同的PHP文件。
我有一个 dashboard.php 和 #principal div。仪表板文件分为两部分 - 一个是菜单(包含(“menu.php”);)menu.php 也有一个 CSS MENU ...和(我想链接到不同的 php 文件和Div 谁是我要加载不同文件的主体....
这可能吗？
代码:dashboard.php:
<body id="main">
<header id="topbar">
<img src="./img/logo_toco_small.png">
</header>
<nav id="menu">
<?PHP include ("menu.php"); ?>
</nav>
<hr class="dashboard">
<div id="principal" class="target"></div>
<footer class="footer">
<?PHP include ("footer.php"); ?>
</footer>
</body>
这是menu.php
<ul class="flatflipbuttons">
<li><a href="" class="ttip" title ="Inicio" data-tooltip="Inicio" href="./dashboard.php"><span class="fa fa-home fa-fw"></span></a></li>
<li><a href="" class="ttip" title ="Clientes" data-tooltip="Cientes" ><span class="fa fa-users fa-fw"></span></a></li>
<li><a href="" class="ttip" title ="Proveedores" data-tooltip="Proveedores"><span class="fa fa-truck fa-fw"></span></a></li>
<li><a href="" class="ttip" title ="Usuarios" data-tooltip="Usuarios"><span class="fa fa-user fa-fw"></span></a></li>
<li><a href="" class="ttip" title ="Partes" data-tooltip="Partes"><span class="fa fa-puzzle-piece fa-fw"></span></a></li>
<li><a href="" class="ttip" title ="Productos" data-tooltip="Productos"><span class="fa fa-dropbox fa-fw"></span></a></li>
<li><a href="" class="ttip" title ="Proyectos" data-tooltip="Proyectos"><span class="fa fa-th-list fa-fw"></span></a></li>
<li><a href="" class="ttip" title ="Compras" data-tooltip="Compras"><span class="fa fa-dollar fa-fw"></span></a></li>
<li><a href="" class="ttip" title ="Movimientos" data-tooltip="Movimientos"><span class="fa fa-undo fa-fw"></span></a></li>
<li><a href="" class="ttip" title ="Reportes" data-tooltip="Reportes"><span class="fa fa-line-chart fa-fw"></span></a></li>
<li><a title ="Cotizacion" target="principal" class="ttip" data-tooltip="Cotizaciones"><span class="fa fa-calculator fa-fw"></span></a></li>
<li><a href="./exit.php" class="ttip" data-tooltip="Salir" title ="Salir" ><span class="fa fa-sign-out fa-fw"></span></a></li>
</ul>
菜单和仪表板 php 文件在同一个目录中。提前致谢。
最佳答案
我喜欢这样:
$(function() {
if (Modernizr.history) {
// history is supported; do magical things
// hijack the nav click event
$(".flatflipbuttons").on( "click", "a", function(event) {
event.preventDefault();
_href = $(this).attr("href");
// change the url without a page refresh and add a history entry.
history.pushState(null, null, _href);
// load the content
loadContent(_href); // fear not! we're going to build this function in the next code block
});
} else {
// history is not supported; nothing fancy here
}
});
// set up some variables
var $mainContent = $("#principal"),
$pageWrap = $("#main"),
baseHeight = 0;
// calculate wrapper heights to prevent jumping when loading new content
$pageWrap.height($pageWrap.height());
baseHeight = $pageWrap.height() - $mainContent.height();
function loadContent(href) {
$mainContent
.find("#main-content")
.fadeOut(200, function() { // fade out the content of the current page
$mainContent
.hide()
.load(href + " #main-content", function() { // load the contents of whatever href is
$mainContent.fadeIn(200, function() {
$pageWrap.animate({
height: baseHeight + $mainContent.height() + "px"
});
});
});
});
}
对 HTML 的一些更改
<body id="main">
<header id="topbar"><img src="./img/logo_toco_small.png"></header>
<nav id="menu"><?PHP include ("menu.php"); ?></nav>
<hr class="dashboard">
<div id="principal" class="target">
<div id="main-content">
// Main content goes here...
</div>
</div>
<footer class="footer"> <?PHP include ("footer.php"); ?></footer>
</body>
// menu.php
<ul class="flatflipbuttons">
<li><a href="dashboard.php" class="ttip" title ="Inicio" data-tooltip="Inicio"><span class="fa fa-home fa-fw"></span></a></li>
<li><a href="users.php" class="ttip" title ="Clientes" data-tooltip="Cientes" ><span class="fa fa-users fa-fw"></span></a></li>
...
<li><a href="exit.php" class="ttip" data-tooltip="Salir" title ="Salir" ><span class="fa fa-sign-out fa-fw"></span></a></li>
</ul>
This answer is taken from CSS-Tricks
关于javascript - 在一个div上打开不同的php文件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26350697/