以下是全部代码：
<html>
<head>
<title>jQuery Ajax 实例演示</title>
</head>
<script language="javascript" src="jquery.js"></script>
<script language="javascript">
$(document).ready(function ()
{
$('#send_ajax').click(function (){
var params=$('input').serialize(); //序列化表单的值
$.ajax({
ckeditor/" target="_blank">fckeditor/editor/'ajax_json.php'">url:'ajax_json.php', //后台处理程序
type:'post', //数据发送方式
dataType:'json', //接受数据格式
data:params, //要传递的数据
success:update_page //回传函数(这里是函数名)
});
});
//$.post()方式：
$('#test_post').click(function (){
$.post(
'ajax_json.php',
{
username:$('#input1').val(),
age:$('#input2').val(),
sex:$('#input3').val(),
job:$('#input4').val()
},
function (data) //回传函数
{
var myjson='';
eval('myjson=' + data + ';');
$('#result').html("姓名:" + myjson.username + "<br />工作:" + myjson['job']);
}
);
});
//$.get()方式：
$('#test_get').click(function ()
{
$.get(
'ajax_json.php',
{
username:$("#input1").val(),
age:$("#input2").val(),
sex:$("#input3").val(),
job:$("#input4").val()
},
function(data) //回传函数
{
var myjson='';
eval("myjson=" + data + ";");
$("#result").html(myjson.job);
}
);
});
});
function update_page (json) //回传函数实体，参数为XMLhttpRequest.responseText
{
var str="姓名:"+json.username+"<br />";
str+="年龄:"+json.age+"<br />";
str+="性别:"+json.sex+"<br />";
str+="工作:"+json.job+"<br />";
str+="追加测试:"+json.append;
$("#result").html(str);
}
</script>
<body>
<div id="result" style="background:orange;border:1px solid red;width:300px;height:200px;"></div>
<form id="formtest" action="" method="post">
<p><span>输入姓名:</span><input type="text" name="username" id="input1" /></p>
<p><span>输入年龄:</span><input type="text" name="age" id="input2" /></p>
<p><span>输入性别:</span><input type="text" name="sex" id="input3" /></p>
<p><span>输入工作:</span><input type="text" name="job" id="input4" /></p>
</form>
<button id="send_ajax">提交</button>
<button id="test_post">POST提交</button>
<button id="test_get">GET提交</button>
</body>
</html>
PHP 文件 ajax_json.php：
<?php
//$arr = $_POST; //若以$.get()方式发送数据，则要改成$_GET.或者干脆:$_REQUEST
$arr = $_REQUEST;
$arr['append'] = '测试字符串';
//print_r($arr);
$myjson = my_json_encode($arr);
echo $myjson;
function my_json_encode($phparr)
{
if(function_exists("json_encode"))
{
return json_encode($phparr);
}
else
{
require_once 'json/json.class.php';
$json = new Services_JSON;
return $json->encode($phparr);
}
}
?>

以上是原文：挺好的，以下是本人根据实际应用的一个例子。

只是用到了$.get();这段，用于在信息列表中点击更改文章状态（审核，推荐之类的）的操作。

//$.get()方式：
$('.test_get').click(function (){
  var data_id = $(this).attr("data-id");
  var id = $(this).attr("id");
  var typename = $(this).attr("name");
  var data_value_id = $(this).attr("data-value");
  if(data_value_id==1){
    var data_id_local = 0;
    var data_check = '否 <i class="icon-remove"></i>';
  }else{
    var data_id_local = 1;
    var data_check = '是 <i class="icon-ok"></i>';  }
    $('#'+id).attr("data-value",data_id_local);
    $('#'+id).html(data_check);
    $.get(
      'ajax_json.php',//这人文件可以接收到以下三个参数，可以写多个，最后一个不要带“，”;$_GET['data_id']
      {
        data_id:data_id,
        data_value_id:data_value_id,
        typename:typename

},
        function(data) //回传函数
        {
//这块没做返回值 处理，感觉有点慢，在上边直接处理啦，
        }
        );
  });

以下是html代码：

<tr class="gradeX">
<td>66</td>
<td data-value="1" data-id="66" name="isindex" class="test_get " title="点击更改状态" id="isindex66">是 <i class="icon-ok"></i></td>
<td data-value="1" data-id="66" name="isnav" class="test_get " title="点击更改状态" id="isnav66">是 <i class="icon-ok"></i></td>
<td>
<a href="#">和暄清肤霜[和暄清肤霜]</a></td>
<td>2015-09-1 00:00:00</td>
<td class="center ">
<a href="#" class="btn">编辑</a>
<a href="#" class="btn">删除</a>
</td>
</tr>
<tr class="gradeX">
<td>59</td>
<td data-value="0" data-id="59" name="isindex" class="test_get " title="点击更改状态" id="isindex59">否 <i class="icon-remove"></i></td>
<td data-value="1" data-id="59" name="isnav" class="test_get " title="点击更改状态" id="isnav59">是 <i class="icon-ok"></i></td>
<td><a href="#">【湿清霜】效果[【湿清霜】效果]</a></td>
<td >2015-09-1 00:00:00</td>
<td class="center ">
<a href="#" class="btn">编辑</a>
<a href="#" class="btn">删除</a>
</td>
</tr>

php应用jquery做ajax操作的更多相关文章

  1. 【JAVAWEB学习笔记】28_jquery加强：json数据结构、jquery的ajax操作和表单校验插件

    Ajax-jqueryAjax 今天内容: 1.json数据结构(重点) 2.jquery的ajax操作(重点) 3.jquery的插件使用 一.json数据结构 1.什么是json JSON(Jav ...

  2. 【JAVAWEB学习笔记】28_jqueryAjax：json数据结构、jquery的ajax操作和表单校验插件

    Ajax-jqueryAjax 今天内容: 1.json数据结构(重点) 2.jquery的ajax操作(重点) 3.jquery的插件使用   一.json数据结构 1.什么是json JSON(J ...

  3. jQuery常用ajax操作

    在做asp.net项目的时候经常会用到ajax操作,现总结常用的ajax操作供平时项目中参考 第一种: 前端代码: <script type="text/javascript" ...

  4. jQuery的Ajax操作小结——$.ajax和$.getJSON等用法小结

    一.$.ajax用法与举例 jQuery.ajax(url,[settings])     ——返回值:XMLHttpRequest 通过 HTTP 请求加载远程数据,这个是jQuery 的底层 AJ ...

  5. 利用jquery对ajax操作，详解原理（附代码）

    1. jQuery load() 方法 jQuery load() 方法是简单但强大的 AJAX 方法. load() 方法从服务器加载数据,并把返回的数据放入被选元素中. 语法: $(selecto ...

  6. jQuery Ajax 操作函数及deferred对象

    jQuery Ajax 操作函数 jQuery 库拥有完整的 Ajax 兼容套件.其中的函数和方法允许我们在不刷新浏览器的情况下从服务器加载数据. 函数 描述 jQuery.ajax() 执行异步 H ...

  7. 【Java EE 学习 33 上】【JQuery样式操作】【JQuery中的Ajax操作】【JQuery中的XML操作】

    一.JQuery中样式的操作 1.给id=mover的div采用属性增加样式.one $("#b1").click(function(){ $("#mover" ...

  8. 使用jquery来完成AJAX操作

    jQuery对Ajax操作进行了封装,在jQuery中最底层的方法是$.ajax(),第二个是load(),$.get()和$.post(),第三层是$.getscript()和$.getJSON() ...

  9. jQuery 与 Ajax 的应用

    Ajax 全称为 "Asynchronous JavaScript and XML"(异步 JavaScript 和 XML ),它并不是指一种单一的技术,而是有机地利用了一系列交 ...

随机推荐

  1. Fragment基础----信息传递

    如何通过activity来访问fragment的信息呢,我们可以通过一个实例来了解. 使用两个Fragment和一个activity管理 效果图: 第一个fragment来表示输入框 第二个fragm ...

  2. cordova加载层、进度条、文件选择插件

    在做cordova项目的时候,感觉应用的响应速度跟原生应用比相差甚远,一个主要问题就是如加载层.进度条等弹出对话框的效率不行.毕竟项目中的这些弹框都是用dom拼成的,dom的渲染效率和原生控件比起来慢 ...

  3. jQuery-1.9.1源码分析系列（二）jQuery选择器

    1.选择器结构 jQuery的选择器根据源码可以分为几块 init: function( selector, context, rootjQuery ) { ... // HANDLE: $(&quo ...

  4. 一个网站完整详细的SEO优化方案

    根据自己的个人经验完成了这篇文章,希望对SEOer有点帮助,高手直接跳过,请勿喷水... 一个完整的SEO优化方案主要由四个小组组成: 一.前端/页编人员 二.内容编辑人员 三.推广人员 四.数据分析 ...

  5. Elasticsearch 教程--数据

    在Elasticsearch中,每一个文档都有一个版本号码.每当文档产生变化时(包括删除),_version就会增大.在<版本控制>中,我们将会详细讲解如何使用_version的数字来确认 ...

  6. SQL Server时间粒度系列----第8节位运算以及设置日历数据表节假日标志详解

    本文目录列表: 1.位运算 2.设置日历数据表节假日标志 3.总结语 4.参考清单列表   位运算   SQL Server支持的按位运算符有三个,分别为:按位与(&).按位或(|).按位异或 ...

  7. Python_Day_05 计数器(counter)，有序字典(OrderDict)，默认字典(defaultdict)，可命名元祖(namedtuple)，双向队列(deque)，单项队列(deuqe.Queue)

    Counter(计数器) 是一个字典的子类,存储形式同样为字典,其中存储的键为字典的元素,值为元素出现的次数,在使用之前我们需要先导入文件 import collections 初始化一个计数器 im ...

  8. Spring MVC 处理静态资源文件

    摘要: 三个方案: 1.方案一:激活Tomcat的defaultServlet来处理静态文件 2.方案二: 在spring3.0.4以后版本提供了mvc:resources (需要配置annotati ...

  9. Guava学习-目录

    备份一下地址: 目录 1. 基本工具 [Basic utilities] 让使用Java语言变得更舒适 1.1 使用和避免null:null是模棱两可的,会引起令人困惑的错误,有些时候它让人很不舒服. ...

  10. 从零开始学 Java - CentOS 安装 JDK

    我来总结一下吧 昨天我写了一篇从零开始学 Java - 我放弃了 .NET ?,在园子里突然引起了强烈的讨论,有期待我能持续更新的.有鼓励支持的.有相同经历的.也有同一个学校的师兄弟(我们相认了).当 ...