从 ajax 调用时 Google 幻灯片显示空白屏幕
我在实施 Google 幻灯片时遇到问题 (http://www.google.com /uds/solutions/slideshow/index.html) 通过使用 jquery load() 函数加载到我的 Web 应用程序。
索引.html:
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<div id="moshe"></div>
<script type="text/javascript">
$(document).ready(function(){
$('#moshe').load('test.html');
});
</script>
测试.html:
<script type="text/javascript">
function load() {
var samples = "http://dlc0421.googlepages.com/gfss.rss";
var options = {
displayTime: 2000,
transistionTime: 600,
linkTarget : google.feeds.LINK_TARGET_BLANK
};
new GFslideShow(samples, "slideshow", options);
}
google.load("feeds", "1");
google.setOnLoadCallback(load);
</script>
<div id="slideshow" class="gslideshow" style="width:300px;height:300px;position:relative; border: 2px solid blue">Loading...</div>
当我执行 test.html 时,它会很好地加载幻灯片。当我尝试使用实际上调用 Jquery 的 $.load() 函数的 index.html 加载时,该函数将 test.html 的内容加载到特定的 div 元素中,我看到图库正在该 div 上加载,但是当它即将显示时图像整个页面都被清除,我只剩下一张空白页。
有什么想法吗?
不使用 jquery 的不同版本的index.html:
<script type="text/javascript">
function makeRequest(url) {
var httpRequest;
if (window.XMLHttpRequest) { // Mozilla, Safari, ...
httpRequest = new XMLHttpRequest();
if (httpRequest.overrideMimeType) {
httpRequest.overrideMimeType('text/xml');
// See note below about this line
}
}
else if (window.ActiveXObject) { // IE
try {
httpRequest = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e) {
try {
httpRequest = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e) {}
}
}
if (!httpRequest) {
alert('Giving up :( Cannot create an XMLHTTP instance');
return false;
}
httpRequest.onreadystatechange = function() { alertContents(httpRequest); };
httpRequest.open('GET', url, true);
httpRequest.send('');
}
function alertContents(httpRequest) {
if (httpRequest.readyState == 4) {
if (httpRequest.status == 200) {
document.getElementById('moshe').innerHTML=httpRequest.responseText;
} else {
alert('There was a problem with the request.');
}
}
}
makeRequest('test.html');
</script>
I'm having problems implementing google slideshow (http://www.google.com/uds/solutions/slideshow/index.html) to my web application by loading it using a jquery load() function.
index.html:
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<div id="moshe"></div>
<script type="text/javascript">
$(document).ready(function(){
$('#moshe').load('test.html');
});
</script>
test.html:
<script type="text/javascript">
function load() {
var samples = "http://dlc0421.googlepages.com/gfss.rss";
var options = {
displayTime: 2000,
transistionTime: 600,
linkTarget : google.feeds.LINK_TARGET_BLANK
};
new GFslideShow(samples, "slideshow", options);
}
google.load("feeds", "1");
google.setOnLoadCallback(load);
</script>
<div id="slideshow" class="gslideshow" style="width:300px;height:300px;position:relative; border: 2px solid blue">Loading...</div>
When i execute the test.html, it loads the slideshow just fine. when i try to load using index.html that actually calls Jquery's $.load() function that loads the content of test.html into a specific div element, i see that the gallery is loading on that div, but when it's about to show images the entire page clears and all i have is a blank page.
Any ideas ?
a different version of index.html without using jquery:
<script type="text/javascript">
function makeRequest(url) {
var httpRequest;
if (window.XMLHttpRequest) { // Mozilla, Safari, ...
httpRequest = new XMLHttpRequest();
if (httpRequest.overrideMimeType) {
httpRequest.overrideMimeType('text/xml');
// See note below about this line
}
}
else if (window.ActiveXObject) { // IE
try {
httpRequest = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e) {
try {
httpRequest = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e) {}
}
}
if (!httpRequest) {
alert('Giving up :( Cannot create an XMLHTTP instance');
return false;
}
httpRequest.onreadystatechange = function() { alertContents(httpRequest); };
httpRequest.open('GET', url, true);
httpRequest.send('');
}
function alertContents(httpRequest) {
if (httpRequest.readyState == 4) {
if (httpRequest.status == 200) {
document.getElementById('moshe').innerHTML=httpRequest.responseText;
} else {
alert('There was a problem with the request.');
}
}
}
makeRequest('test.html');
</script>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
也尝试放入
,
我不知道您是否复制或输入了此内容,但是
当您想要
我个人使用时您可以使用:
但我不确定哪个是最好的。
try putting
into
also, i don't know if you copied or typed this in, but you have
when you want
i personally use:
but i'm not sure which is best.