ajax+php分页

ajax|分页

分页应该比较简单的。你就返回一个XML格式的table替换原先的table 就ok.

1,动态删除Table 里面内容技巧,不需要写太多代码,一行:
tb.removeNode(true)

2,动态增加行,除了CreateElement方法,还可以这样比较短小:

<table id=tb1></table>
<SCRIPT>
function addTable(){
   var row1 = tb1.insertRow();
   var cell1=row1.insertCell();
   var cell2=row1.insertCell();
   cell1.innerText="灰豆宝宝";
   cell2.innerText="超级大笨狼"
}
</SCRIPT> 
<INPUT TYPE = "button" VALUE = "AddTable" onclick = "addTable()">

3,在DIV中动态增加Table

<SCRIPT>
function addTable(){
   var tb1 = document.createElement("table");
   tb1.border="1px";
   var row1 = tb1.insertRow();
   var cell1=row1.insertCell();
   var cell2=row1.insertCell();
   mydiv.appendChild(tb1);
   cell1.innerText="wanghr100";
   cell2.innerText="panyuguang962"
}
</SCRIPT>
<BODY>
<div id=mydiv style="width:400;height:300;"></div>
<INPUT TYPE = "button" VALUE = "AddTable" onclick = "addTable()">

4,在DIV中删除Table,简单只要Div.innerHTML=""就可以。

以上是部分实用相对短小的代码,当然有其他各种办法实现,不过一般都比上面的长,比如组合使用DIV对象的insertAdjacentHTML 方法等,在不同需要下使用不同方法,前提是研究好浏览器模型 的各种对象的方法属性。尤其是熟悉CSS+HTML就会做的很酷。就JS语言本身来说要求不高。

以下是以Document对象为例,相关方法有:

Method Description
attachEvent
createAttribute   
createComment  
createDocumentFragment 
createElement 
createEventObject 
createStyleSheet 
createTextNode 
detachEvent
getElementById  
getElementsByName 
getElementsByTagName
mergeAttributes
recalc
write  
writeln 
以DIV对象为例相关方法有:
addBehavior 
appendChild 
applyElement 
attachEvent
clearAttributes
cloneNode
contains 
detachEvent
getAdjacentText   
getAttribute  
getAttributeNode
getElementsByTagName
hasChildNodes 
insertAdjacentElement 
insertAdjacentHTML 
insertAdjacentText
insertBefore
mergeAttributes
normalize
removeAttribute 
removeAttributeNode  
removeBehavior
removeChild
removeExpression
removeNode
replaceAdjacentText
replaceChild
replaceNode
setActive
setAttribute
setAttributeNode
setExpression  

异步调用

 <SCRIPT LANGUAGE="JavaScript">
 
function getData()
{
 var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
 // 异步调用
 xmlhttp.onreadystatechange = function()
 {
  if (xmlhttp.readyState == 4) // 调用完毕
  {
   if (xmlhttp.status == 200) // 加载成功
   {
    var xmldoc = xmlhttp.responseXML;
    var root = xmldoc.documentElement;
    alert (xmldoc.xml);
   }
  }
 }  
 var url = 'xml.asp';
 xmlhttp.open("get", url, true);
 xmlhttp.send();
}
 
</SCRIPT>
 
<BODY>

异步调用 xmlhttp 取后台数据,你可以搞成PHP的

<input type="button" value="GetData" >
 <%
dim i, xml
xml = "<?xml version='1.0' encoding='gb2312' ?>"
xml = xml & "<data>"
for i = 1 to 50
 xml = xml & "<record>记录" & i & "</record>"
next
xml = xml & "</data>"
response.ContentType = "text/xml"
response.write xml
%>

时间: 2024-09-10 16:59:09

ajax+php分页的相关文章

PHP+Ajax实现分页技术

PHP+Ajax实现分页技术: 基于php和ajax的分页技术代码,下面有两个php文件,一个是sn_inq.php,另一个是sn_show.php,前一个php文件调用后一个php文件,实现ajax分页,运行sn_inq即可实现效果,不过得修改数据库哦.具体代码如下:红色标注的地方要特别注意修改哦! 我的数据库名是inv,表名是sn,字段有:sn_id,sn_plant,sn_sales,sn_act,sn_type,sn_sts..... 1.sn_inq.php //getFormValu

ASP AJAX 静态分页第1/2页_AJAX相关

<html> <head> <title>AJAX静态分页演示:http://www.jb51.net</title> <meta http-equiv="content-type" content="text/html;charset=gb2312"> <style type="text/css"> <!-- body                { text-al

基于AJAX的分页类实现代码_AJAX相关

复制代码 代码如下: /** * <p>pagination.js * <p>通用的基于AJAX的分页类 * @author jeanwendy * @version 1.0 */ var paginationIndex = 0; var pagination = function(trTemplatId) {     $().ajaxStart(function() {         $.blockUI({             message : '<table>

asp.net 使用ObjectDataSource控件在ASP.NET中实现Ajax真分页_实用技巧

ListView控件本身并没有分页功能,不过借助于ASP.NET中新增加的DataPager控件,我们可以非常方便地对ListView中的数据设置分页,这几乎不需要开发人员写一行代码,将ListView控件放到页面上,设置好布局和DataSource,然后再添加一个DataPager控件,将它的PagedControlID属性设置成ListView的ID,PageSize中设置每页要显示的数据条数,然后在Fields中设置好分页的样式(当然你完全可以不用去管样式,ASP.NET会根据内置的样式来

asp.net+ajax简单分页实例分析

本文实例讲述了asp.net+ajax简单分页实现方法.分享给大家供大家参考,具体如下: 这里涉及两个.aspx文件,一个叫Default.aspx,一个叫AjaxOperations.aspx,第一个用来显示一些测试数据,后一个用来对分页进行处理.js文件夹下面还有一个testJs.js的文件,它就是ajax操作的核心部分.不错,code is cheap.看代码: /*testJs.js*/ // 此函数等价于document.getElementById /document.all fun

asp.net+ajax简单分页实例分析_AJAX相关

本文实例讲述了asp.net+ajax简单分页实现方法.分享给大家供大家参考,具体如下: 这里涉及两个.aspx文件,一个叫Default.aspx,一个叫AjaxOperations.aspx,第一个用来显示一些测试数据,后一个用来对分页进行处理.js文件夹下面还有一个testJs.js的文件,它就是ajax操作的核心部分.不错,code is cheap.看代码: /*testJs.js*/ // 此函数等价于document.getElementById /document.all fun

WordPress博客实现Ajax评论分页教程

下面详细介绍一下非插件实现 Ajax 评论分页的实现过程. 加载 jQuery 库 加载jQuery库,一般主题都会加载jQuery库的.如果你的没有,那就在主题的header.php文件的(/head)(注意把()换成<>)前面添加以下代码: <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 开启 WordPress 评论分页 打开

ajax实现分页效果一

总共有两个文件,第一个文件为index.html是用来显示的文件,第二个就p.asp文件处理并返回页面. 先来看看效果图吧: 下面是调用页面index.html <html> <head> <title>AJAX静态分页</title> <meta http-equiv="content-type" content="text/html;charset=gb2312"> <style type=&qu

WordPress中Ajax评论分页实现方法

一.准备 加载 jQuery 库,这个不解释了.  二.开启 WordPress 评论分页 打开 WordPress 后台 – 设置 – 讨论,在"其他评论设置"中勾选分页显示评论,设置一下评论数目,这里的评论数目仅计算主评论,回复评论不作计算.这里 Kayo 填了比较大的数字(15),因为评论分页分得太细会使用户不便于阅读之前的评论.  在后台开启评论分页后,在 comments.php 中需要添加分页导航的地方加入以下代码(如主题中有类似代码则无须再添加,另外代码中的 nav 标签

jQuery simplePage+AJAX plus分页插件用法实例_jquery

本文实例讲述了jQuery simplePage+AJAX plus分页插件.分享给大家供大家参考,具体如下: <!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&q