效果图:

一:返回数据是text时

1.表单代码:

<body>
<form action="#" method="post">
姓名:<input type="text" id="name"><br>
编号:<input type="text" id="num"><br>
内容:<textarea cols="18" rows="10" style="overflow-y: scroll;" id="neirong"></textarea><br>
<input type="button" id="tijiao" value="提交"/>
<input type="reset">
</form>
<table border="1" cellspacing="0" cellpadding="0" id="tianjia"> //定义一个table,准备接收数据 </table>

2.jquery代码:

<script type="text/javascript">
$("#tijiao").click(function(){
var name=$("#name").val();
var num=$("#num").val();
var neirong=$("#neirong").val();
if(name=="" || num=="" ||neirong=="") //判断非空
{
alert("不能有空");
return false; //如果非空,终止程序
} else{
$.ajax({
type:"post",
url:"chuli.php",
async:true,
data:{name:name,num:num,neirong:neirong},
dataType:"TEXT",
success:function(data)
{
var str="<tr><th>"+"姓名"+"</th><th>"+"编号"+"</th><th>"+"内容"+"</th></tr>"; //定义表格的头行 var attr=data.split("|"); //把data数据分割成一个二维数组attr for(var i=0;i<attr.length;i++)
{
var attr1=attr[i].split("^"); //把二维数组attr的每一项按^分割为一位数组
str=str+"<tr><td>"+attr1[1]+"</td><td>"+attr1[2]+"</td><td>"+attr1[3]+"</td></tr>"; //造行与列,取一维数组中的项添加到表格的列中
}
$("#tianjia").html(str); //把拼接的变量添加到表格中
} }); }
}) </script>

3.处理页面代码

$name=$_POST["name"];
$num=$_POST["num"];
$neirong=$_POST["neirong"];
include("../gongju/DBDA.class.php");
$db=new DBDA();
$sql="insert into renyuan values('','{$name}','{$num}','{$neirong}')"; //把数据插入到表格中
if($db->Query($sql,0)) //如果插入,则显示
{ $sql1="select * from renyuan";
$attr=$db->StrQuery($sql1); //调用strquery方法,返回字符串类型的数据
echo $attr;
}

二:返回数据类型是json格式时

1.把dataType改成“json”

2.处理页面中的输出方式

其他方式跟text一样

使用jquery、ajax不刷新页面打印表格(返回数据类型text、json);的更多相关文章

  1. Jquery Ajax调用aspx页面方法

    Jquery Ajax调用aspx页面方法 在asp.net webform开发中,用jQuery ajax传值一般有几种玩法 1)普通玩法:通过一般处理程序ashx进行处理: 2)高级玩法:通过as ...

  2. jquery.ajax请求aspx和ashx的异同 Jquery Ajax调用aspx页面方法

    1.jquery.ajax请求aspx 请求aspx的静态方法要注意一下问题: (1)aspx的后台方法必须静态,而且添加webmethod特性 (2)在ajax方法中contentType必须是“a ...

  3. ajax——三级联动下拉列表框的优化(简化页面,用jquery插件代替原来页面代码,返回处理数据类型为"TEXT")

    数据库: 主页面 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://ww ...

  4. Ajax回退刷新页面问题的解决办法

    在脚本之家看到一篇文章,觉得以后可能会用上,但是竟然不能收藏,所以只能将其转到博客园. 以下是原文地址: http://www.jb51.net/article/87856.htm   这篇文章主要介 ...

  5. Jquery Ajax的时候 老是返回到 error,是因为json格式不正规的原因

    Jquery Ajax的时候 老是返回到 error,是因为json格式不正规的原因: 怪不得不执行,原来我返回的是{success:true,id:1} 这种不规则的字符串,不是严格的json格式, ...

  6. 11月13日上午ajax返回数据类型为JSON数据的处理

    ajax返回数据类型为JSON数据的处理 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &qu ...

  7. jQuery Ajax无刷新操作

    下面是“无刷新登录”的例子,采用Ashx+jQuery Ajax实现. //后台实例代码 ashx文件(可替换为从数据库中读取) public void ProcessRequest(HttpCont ...

  8. Jquery Ajax调用aspx页面方法 (转载)

    在asp.net webform开发中,用jQuery ajax传值一般有几种玩法 1)普通玩法:通过一般处理程序ashx进行处理: 2)高级玩法:通过aspx.cs中的静态方法+WebMethod进 ...

  9. Jquery Ajax调用aspx页面实例

    目前,我会的几种asp.net界面与后台代码交互方式有几种: 1.webform+服务器控件交互: 2.webform+jquery+ajax+一般处理程序交互: 3.webform+jquery+a ...

随机推荐

  1. zynq学习01 新建一个Helloworld工程

    1,好早买了块FPGA板,zynq 7010 .终极目标是完成相机图像采集及处理.一个Window C++程序猿才开始学FPGA,一个小菜鸟,准备转行. 2,关于这块板,卖家的官方资料学起来没劲.推荐 ...

  2. Eclipse中的一些快捷键的使用

    Eclipse是一款强大的编程工具,在使用的过程中,若能够有效的使用其快捷键,效率会得到很大的提升,下面是一些常用的eclipse快捷键,可谓是键键精彩. 1.成单词:Alt+/ 2 重构之重命名:S ...

  3. c++ 数据类型转换: static_cast dynamic_cast reinterpret_cast const_cast

    c++ 数据类型转换: static_cast dynamic_cast reinterpret_cast const_cast  [版权声明]转载请注明出处 http://www.cnblogs.c ...

  4. 【学习笔记】python 简单创建新建一个网络客户端,并返回相关的信息

    #导入socket包 import socket #使用socket.socket创建socket连接 #AF_INET表示通信类型,与IPv4对应 #SOCK_STREAM对应TCP通信 print ...

  5. ubuntu 13.04 telnet 详细配置

    1. sudo vi /etc/xinetd.d/telnet并加入以下内容:# default: on# description: The telnet server serves telnet s ...

  6. Android事件分发机制(下)

    这篇文章继续讨论Android事件分发机制,首先我们来探讨一下,什么是ViewGroup?它和普通的View有什么区别? 顾名思义,ViewGroup就是一组View的集合,它包含很多的子View和子 ...

  7. 用JAVA写简单的栈

    package com.gailekesi.example.expl_tuple; import javax.naming.NameNotFoundException; import java.awt ...

  8. Linux安装FTP服务

    转自:http://blog.csdn.net/huangbiao86/article/details/6641952 ftp服务器 1.  在Linux和其他机器之间共享文件(在linux下安装ft ...

  9. android技巧(五)一个异步+接口回调的例子

    public class DataBaseUtils { // 当前数据库地址 private String DB_PATH; // 备份后数据库保存地址 private String DB_BACK ...

  10. JS生成二维码,允许中文转码

    一.使用jquery-qrcode生成二维码 先简单说一下jquery-qrcode,这个开源的三方库(可以从https://github.com/jeromeetienne/jquery-qrcod ...