0
我使用AJAX加載一些html,這取決於Javascript標頭。Jquery和AJAX不能使用Javascript標頭
我在主頁上有一個jquery支持的幻燈片,以及下一頁上的jQuery動畫庫。
我的jquery幻燈片的作品,但後來當我點擊我的loadXMLDoc鏈接jquery畫廊將無法正常工作。
這裏是我的網頁上的jQuery的幻燈片:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Photo Design</title>
<script type="text/javascript">
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.body.innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","ajax_info.php",true);
xmlhttp.send();
}
</script>
<link rel="stylesheet" type="text/css" href="style.css"/>
<script type='text/javascript' src='js/jquery.js'></script>
//Gallery javascript stuff
<script type="text/javascript" src="fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
<script type="text/javascript" src="fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<link rel="stylesheet" type="text/css" href="fancybox/jquery.fancybox-1.3.4.css" media="screen" />
//Slideshow javascript stuff
<link rel="stylesheet" href="js/prettyPhoto/css/prettyPhoto.css" type="text/css" media="screen"/>
<script src="js/prettyPhoto/js/jquery.prettyPhoto.js" type="text/javascript"></script>
<script type='text/javascript' src='js/jquery.aviaSlider.min.js'></script>
<script type='text/javascript' src='js/custom.min.js'></script>
<script type="text/javascript">
$(document).ready(function() {
$("a[rel=example_group]").fancybox({
'transitionIn' : 'elastic',
'transitionOut' : 'elastic',
'autoScale' : true,
'titleFormat' : function(title, currentArray, currentIndex, currentOpts) {
return '';
}
});
});
</script>
</head>
<body>
<a href="javascript:loadXMLDoc()">Gallery</a>
<div id="content">
<div id="centered">
<ul class='aviaslider' id="frontpage-slider">
<li><img src="photos/home/1.jpg" alt=""/></li>
<li><img src="photos/home/2.jpg" alt=""/></li>
<li><img src="photos/home/3.jpg" alt=""/></li>
<li><img src="photos/home/4.jpg" alt=""/></li>
</ul>
</div>
</div>
</body>
</html>
這裏是我的ajax_info.php頁:
<div id="content">
<div id="gallery">
<div class="thumbnails">
<a rel="example_group" href="photos/seniors/10big.jpg"><img alt="" src="photos/seniors/10thumb.jpg"/></a>
<a rel="example_group" href="photos/seniors/11big.jpg"><img alt="" src="photos/seniors/11thumb.jpg"/></a>
<a rel="example_group" href="photos/seniors/12big.jpg"><img alt="" src="photos/seniors/12thumb.jpg"/></a>
<a rel="example_group" href="photos/seniors/13big.jpg"><img alt="" src="photos/seniors/13thumb.jpg"/></a>
<a rel="example_group" href="photos/seniors/14big.jpg"><img alt="" src="photos/seniors/14thumb.jpg"/></a>
</div>
</div>
</div>
由於您使用jQuery,爲什麼使用'window.XMLHttpRequest'? – cherouvim
爲什麼你重新發明了AJAX輪,而jQuery提供了各種AJAX請求的實用程序,比如'$ .ajax'? –
感謝您指點我正確的方向。我是AJAX noob。 – user1022422