Ajax 通过 jquery 加载,内容未显示
Ajax load via jquery, content not shown
嗨,我有一个HTML文件,它使用ajax从同一服务器中的其他HTML文件加载内容。 由于某种原因它不起作用?? 我不知道,因为我是 Ajax 的新手。
这是索引.html(默认主页)
<!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" />
<link rel="stylesheet" type="text/css" href="demo.css" />
<script type="text/javascript" src="../jquery.min.js"></script>
<script type="text/javascript" src="script.js"></script>
</head><body><div id="rounded">
<img src="img/top_bg.gif" alt="top" /><div id="main" class="container">
<h1>ajax example</h1>
<h2>ajax jquery</h2>
<ul id="navigation">
<li><a href="#info">Page_1</a></li>
<li><a href="#page2">Page2</a></li>
<li><a href="#page3">Page_3</a></li>
<li><a href="#page4">Page_4</a></li>
<li><img id="loading" src="img/ajax_load.gif" alt="loading" /></li>
</ul>
<div class="clear"></div>
<div id="pageContent">
it is a test</div>
</div><div class="clear"></div>
<img src="img/bottom_bg.gif" alt="bottom" /></div>
</body>
</html>
script.js(用于在URL中添加哈希并启用后退按钮以及加载内容)
ar default_content = "";
$(document).ready(function () {
checkURL();
$('ul li a').click(function (e) {
checkURL(this.hash);
});
default_content = $('#pageContent').html();
setInterval("checkURL()", 250);
});
var lasturl = "";
function checkURL(hash) {
if (!hash) hash = window.location.hash;
if (hash != lasturl) {
lasturl = hash;
if (hash == "")
$('#pageContent').html(default_content);
else
loadPage(hash);
}
}
function loadPage(url) {
var datastring = url.replace('#', '');
$('#loading').css('visibility', 'visible');
$.ajax({
type: "POST",
url: "load_page.php",
data: 'datastring=' + datastring,
dataType: "html",
async: false,
success: function (msg) {
if (parseInt(msg) != 0) {
$('#content').html(msg);
$('#loading').css('visibility', 'hidden');
}
}
});
}
和load_page.php
<?php
$url = $_REQUEST['datastring'];
echo $url;
if(file_exists(''.$url.'.html')){
echo file_get_contents(''.$url.'.html');
}
else{
echo 'There is no such page!';
}
?>
需要帮助! 正如你所看到的,当 Ajax 调用 "PageContent"div 从请求的页面加载内容时,但这里什么也没发生! 我做错了什么?
看起来你在 ajax 响应处理程序中有"#content"...应为"#pageContent"以匹配div ID。 那是:
success: function (msg) {
if (parseInt(msg) != 0) {
$('#pageContent').html(msg);
$('#loading').css('visibility', 'hidden');
}
}
相关文章:
- 如何通过所选索引(AngularJS)在模态弹出窗口中显示数据
- 通过javascript显示和更改文本
- 当选择值x时,Javascript需要在正确的位置显示文本区域,从而循环通过具有选择选项的表单
- 如何通过ajax将png图片从服务器发送到浏览器中显示
- Jquery/Javascript:通过按下按钮显示数组中的随机图像
- 如何隐藏和显示通过窗体填充的表
- 使用Google Drive Viewer显示通过Google Drive API创建的文件
- 防止显示 通过 JavaScript 在 php 中重复输入
- 无法在另一个视图中显示通过AJAX调用获得的数据
- 为什么ng绑定不't显示通过ng单击设置的rootScope中的值
- QWebView可以't显示通过javascript$(<node_name>).html(<)
- 显示通过html表单上传的照片预览
- 透明src,使背景显示通过
- 无法显示通过ajax调用获得的数据
- 需要做刷新显示数组,传入json数据和显示通过ng-repeat
- Android - Jquery Mobile -按钮显示通过警报框
- PHP脚本不显示通过我的ajax加载的内容
- 量角器黄瓜BDD测试在执行前显示通过
- 提交表单,然后显示通过JavaScript加载图像
- 复选框显示通过模态框