我有一个meny.php文件,使用ajax加载id为content的div的选定链接,如您在页脚包含之前所见。这段代码正在运行,并没有什么空间。我只是认为这段代码可能会有所帮助。
<!DOCTYPE html>
<?php
include 'includes/head.php';
?>
<body>
<script type="text/javascript">
$(document).ready(function() {
/* This is basic - uses default settings */
$("a.single_image").fancybox();
/* Using custom settings */
$("a#inline").fancybox({
'hideOnContentClick': true
});
/* Apply fancybox to multiple items */
$("a.group").fancybox({
'href' : '#fancybox-inner',
'transitionIn' : 'elastic',
'transitionOut' : 'elastic',
'speedIn' : 600,
'speedOut' : 200,
'overlayShow' : false
});
$("a.single_image").fancybox({
'href' : '#fancybox-inner',
'titleShow' : false,
'transitionIn' : 'elastic',
'transitionOut' : 'elastic'
});
});
$(function(){
// hide the div on page load and use a slidedown effect
$('div.content').fadeOut(0, function(){
$(this).slideDown(500);
});
// capture link clicks and slide up then go to the links href attribute
$('a.slide_page1').click(function(e){
e.preventDefault();
var $href = $(this).attr('href');
$('div.content').slideUp(500, function(){
// window.location = $href;
// alert($href);
});
});
});
</script>
<div class="page">
<?php
include 'includes/header.php';
?>
<div class="container-fluid" id = "bodu">
<div class="row-fluid">
<div class="span12">
<div class="bodu">
<div class="blog">
<div class="container-fluid">
<div class="row-fluid">
<div class="span2" id ="sidebarspan">
<h2>Meny</h2>
<ul id="nav">
<li id ="sidebar">
<a href="hamburgare">Hamburgare</a>
</li>
<li id ="sidebar">
<a href="maltider">Måltider</a>
</li>
<li id ="sidebar">
<a href="dryck">Dryck</a>
</li>
<li id ="sidebar">
<a href="tillbehor">Tillbehör</a>
</li>
<li id ="sidebar">
<a href="desserter">Desserter</a>
</li>
<li id ="sidebar">
<a href="övrigt">Övrigt</a>
</li>
</ul>
</div>
<div class="span10">
<div id = "content" class="content">
<script src="jquery/general.js"></script>
</div>
</div>
</div>
</div>
</div>
<?php
include 'includes/footer.php';
?>
</div>
</div>
</div>
</div>
<div id="bg-bottom" >
<img src="images/bg-bottom.png" alt="bottom">
</div>
</div>
</div>
</body>
现在是真正的问题。让我们说我们从meny.php中选择了“hamburgere”。然后它将尝试像我用ajax hamburgare.php文件一样加载。该文件看起来像这样
<?php
include '../includes/head.php';
?>
<h1>Hamburgare!</h1>
<p>hamburgare är gott!</p>
<div class="row-fluid" id = "meals">
<div class="span12" id="right-pane">
<?php
$select = "SELECT * FROM hamburgare";
$sql = mysql_query($select) or die(mysql_error());
mysql_num_rows($sql);
while ($row = mysql_fetch_array($sql)) {
$name = "<name>".$row['name']."</name>";
$price = "<price>".$row['price']."</price>";
$description = "<description>".$row['description']." </description>";
$img = $row['image'];
$event = " <a name='$img' class='single_image' href='fancybox-inner' ><img src='Login/$img'/></a>";
echo $event;
/*closing the whileloop*/
}
?>
</div>
</div>
<div style="display:none">
<div id="fancybox-inner">
<?php
$query = mysql_query('SELECT name FROM hamburgare WHERE image = "' . $img . '"');
?>
<div class="container-fluid">
<div class="row-fluid">
<h2><?php echo $query ?></h2>
<h2><?php echo $name ?></h2>
<div class="span4">
<img src="Login/<?php echo $img; ?>" />
<!--Sidebar content-->
</div>
<div class="span8">
<?php echo $description ?>
<!--Body content-->
</div>
</div>
</div>
</div>
</div>
我在这里要做的是从数据库中的hamburgare表中加载所有图像,现在我只是在a-tag中的while循环中打印它们。这样工作正常,但当客户点击其中一个图像时,应向客户显示更具体的信息。 这里发生的是当你点击其中一个图像时显示fancybox-inner div但fancybox-inner包含的信息是关于最后加载的图像。这意味着选择女巫形象并不重要,它将始终显示有关最后加载的图像的信息。 原因是因为最后一个SQL查询中的WHERE子句,我比较了最后加载的图像($ img)谁等于数据库中的图像。那么我发生了这个重叠的问题。另外我与$ img比较,而不是showsen a-tag中的name = $ img,我不知道如何编写SQL查询。
我怎么认为问题比那更重要。我唯一要做的就是隐藏fancybox-inner div,并在选择某些图像时显示它。该代码从一开始就执行。所以我需要Jquery / AJAX来为每个图像加载正确的信息。所以我想我需要为while循环中的每个a-tag添加onClick。 但由于我是新手,我不知道如何编写代码。也许我的假设也是错误的。我不知道。
你们觉得怎么样?我会感谢各种帮助。
提前致谢
答案 0 :(得分:0)
您应该首先将返回的值添加到数组中,然后再执行输出。
例如:
$formattedResults = array();
while( $row = mysql_fetch_array( $sql ) )
{
$formattedResults[] = array(
'name' => sprintf( '<name>%s</name>', $row['name'] ),
'price' => sprintf( '<price>%s</price>', $row['price'] ),
'description' => sprintf( '<description>%s</description>', $row['description'] ),
'img' => $row['image'],
'event' => sprintf( '<a name="%s" class="single_image" href="fancybox-inner" ><img src="Login/%s"/></a>', $row['image'], $row['image'] ),
);
}
var_dump( $formattedResults );