ajax翻页效果模仿yii框架自己写的

 更新时间:2014年03月17日 16:33:18   作者:  
这篇文章主要介绍了自己写的ajax翻页效果,模仿yii框架,需要的朋友可以参考下
复制代码 代码如下:

<!DOCTYPE html>
<html>
<head>
<title>ajax分页</title>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script>
function loadXMLDoc($url)
{
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)
{
var $data = $('<div>' + xmlhttp.responseText + '</div>');
// alert($("#updateId", $data).html());
// document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
$("#updateId").replaceWith($("#updateId", $data));
}
}
xmlhttp.open("GET",$url,true);
xmlhttp.send();
}
</script>
</head>


<body>


<table id="updateId">
<tr><td>id</td><td>标题</td><td>时间</td></tr>
<?php if(isset($_GET['p'])&&$_GET['p'] == 2): ?>
<tr><td>2</td><td>222</td><td>222</td></tr>
<tr><td>2</td><td>222</td><td>222</td></tr>
<?php else: ?>
<tr><td>1</td><td>111</td><td>111</td></tr>
<tr><td>1</td><td>111</td><td>111</td></tr>
<?php endif; ?>


</table>
<div><a href="javascript:;" onclick="loadXMLDoc('?p=1')">1</a><a href="javascript:;" onclick="loadXMLDoc('?p=2')">2</a></div>
</body>
</html>

相关文章

  • ajax和jsonp跨域的原理本质详解

    ajax和jsonp跨域的原理本质详解

    跨域问题是我们在开发中经常会遇到的一个需求,下面这篇文章主要给大家介绍了关于ajax和jsonp跨域的原理本质,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧。
    2017-11-11
  • 也写一个Ajax.Request类附代码

    也写一个Ajax.Request类附代码

    也写一个Ajax.Request类附代码...
    2007-08-08
  • AJAX和三层架构实现分页功能具体思路及代码

    AJAX和三层架构实现分页功能具体思路及代码

    本文涉及到AJAX和三层架构方面的知识,在学习分页的同时也巩固了一下它们的相关知识,适合初学者的你
    2013-05-05
  • 163 AJAX Tab

    163 AJAX Tab

    163 AJAX Tab...
    2007-01-01
  • AJAX使用get与post模式的区别分析

    AJAX使用get与post模式的区别分析

    这篇文章主要介绍了AJAX使用get与post模式的区别,实例分析了Ajax中get与post的具体用法与使用区别,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-03-03
  • 基于firefox实现ajax图片上传

    基于firefox实现ajax图片上传

    这篇文章主要介绍了基于firefox实现ajax图片上传,大家都知道在FF下使用ajax是件挺困难的事情,今天给大家介绍的是完美解决这个问题的方法,小伙伴可以参考下。
    2015-05-05
  • 纯javascript的ajax实现php异步提交表单的简单实例

    纯javascript的ajax实现php异步提交表单的简单实例

    下面小编就为大家带来一篇纯javascript的ajax实现php异步提交表单的简单实例。小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-05-05
  • ajax跨域访问报错501的解决方法

    ajax跨域访问报错501的解决方法

    这篇文章主要为大家详细介绍了ajax跨域访问报错501的解决方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-12-12
  • Ajax bootstrap美化网页并实现页面的加载删除与查看详情

    Ajax bootstrap美化网页并实现页面的加载删除与查看详情

    Bootstrap是Twitter推出的一个开源的用于前端开发的工具包,Bootstrap提供了优雅的HTML和CSS规范,它即是由动态CSS语言Less写成。下面通过本文给大家介绍Ajax bootstrap美化网页并实现页面的加载删除与查看详情,需要的朋友可以参考下
    2017-03-03
  • ajax实现服务器与浏览器长连接的功能

    ajax实现服务器与浏览器长连接的功能

    这篇文章主要介绍了ajax实现服务器与浏览器长连接的功能的相关资料,感兴趣的小伙伴们可以参考一下
    2016-04-04

最新评论