我之前创建了这个问题，但以另一种方式，没有得到答案。所以今天我写了一些简单的代码来清晰地分享我的问题。
- 我曾经
jQuery调用图像幻灯片功能。 - 中的 AJAX 函数
show.php将调用get.php并在 DIV 中打印结果。
我的问题是在提供的 DIV 内滑动（上一个 - 下一个）get.php在show.php. 但是如果我get.php直接在我的浏览器中调用，那么它就可以工作。
我很困惑，我想在调用 AJAX 时我的 div 中有错误。
我的文件
显示.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test </title>
<link rel="stylesheet" type="text/css" href="demo.css" />
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="newscript.js"></script>
<link href="themes/2/js-image-slider.css" rel="stylesheet" type="text/css" />
<script src="themes/2/js-image-slider.js" type="text/javascript"></script>
<link href="generic.css" rel="stylesheet" type="text/css" />
</head>
<body>
<?php
include("samiloxide.php");
$sql=mysql_query(" select * from section ");
while($r=mysql_fetch_array($sql)){
echo "<li><a onclick='loadpage($r[id])' >$r[section]</a></li>" ;
}
?>
<div id="pageContent"></div>
</body>
</html>
新脚本.js
var section;
function loadpage(section){
var section = section.toString();
$.ajax({
type: "POST",
url: "get.php",
dataType: "script",
data: ({section : section}),
success: function(html){
$("#pageContent").empty();
$("#pageContent").append(html);
}
});
}
获取.php
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<style type="text/css">
<!--
#gallery-wrap{margin: 0 auto; overflow: hidden; width: 732px; position: relative;}
#gallery{position: relative; left: 0; top: 0;}
#gallery li{float: left; margin: 0 20px 15px 0;}
#gallery li a img{border: 4px solid #40331b; height: 175px; width: 160px;}
#gallery-controls{margin: 0 auto; width: 732px;}
#gallery-prev{float: left;}
#gallery-next{float: right;}
-->
</style>
<script type="text/javascript">
<!--
$(document).ready(function(){
// Gallery
if(jQuery("#gallery").length){
// Declare variables
var totalImages = jQuery("#gallery > li").length,
imageWidth = jQuery("#gallery > li:first").outerWidth(true),
totalWidth = imageWidth * totalImages,
visibleImages = Math.round(jQuery("#gallery-wrap").width() / imageWidth),
visibleWidth = visibleImages * imageWidth,
stopPosition = (visibleWidth - totalWidth);
jQuery("#gallery").width(totalWidth);
jQuery("#gallery-prev").click(function(){
if(jQuery("#gallery").position().left < 0 && !jQuery("#gallery").is(":animated")){
jQuery("#gallery").animate({left : "+=" + imageWidth + "px"});
}
return false;
});
jQuery("#gallery-next").click(function(){
if(jQuery("#gallery").position().left > stopPosition && !jQuery("#gallery").is(":animated")){
jQuery("#gallery").animate({left : "-=" + imageWidth + "px"});
}
return false;
});
}
});
-->
</script>
<?php
include("samiloxide.php");
//if(!$_POST['page']) die("0");
$section = (int)$_POST['section'];
$sql=mysql_query(" select * from images where section='$section'");
echo "
<div id='gallery-wrap'>
<ul id='gallery'>
";
while($rr=mysql_fetch_array($sql)){
echo " <li><a href='$rr[image]'><img src='$rr[image]' alt='' /></a></li>";
}
echo "
</ul>
</div>
<div id='gallery-controls'>
<a href='#' id='gallery-prev'><img src='images/prev.png' alt='' />next</a>
<a href='#' id='gallery-next'><img src='images/next.png' alt='' />last</a>
</div>
";
?>