AJAX获取JSON形式的数据
test.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script>
$(function(){
var url = 'test.php';
$(document).on('click','button',function(){
var params = $('input').serialize();
//alert(params); //user=test&pwd=123&sex=%E7%94%B7
$.ajax({
url : url,
type : 'get',
data : params,
dataType : 'json',
success : function(msg){
alert(msg.user+"\n"+msg.pwd+"\n"+msg.sex);
}
}); });
});
</script>
</head>
<body>
用户名:<input type="text" name="user"><br>
密 码:<input type="password" name="pwd"><br>
性 别:<input type="radio" name="sex" value="男"> 男
<input type="radio" name="sex" value="女"> 女
<br>
<button>提交</button>
</body>
</html>
test.php:
<?php
echo json_encode($_GET); //对$_GET数组进行 JSON 编码 结果:{"user":"admin","pwd":"123","sex":"\u5973"}
?>
结果:

注意:input中的name属性是必须的!
AJAX获取JSON形式的数据的更多相关文章
- Ajax获取 Json文件提取数据
摘自 Ajax获取 Json文件提取数据 1. json文件内容(item.json) [ { "name":"张国立", "sex":&q ...
- ajax获取json形式得题目和答案 实现答题功能
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- 通过Jquery中Ajax获取json文件数据
1. JSON(JavaScript Object Notation): javaScript对象表示法: 是存储和交换文本信息的语法,比xml更小,更快,更易解析. 2. JSON基本书写格式 : ...
- AngularJS学习笔记(3)——通过Ajax获取JSON数据
通过Ajax获取JSON数据 以我之前写的与用户交互的动态清单列表为例,使用JSON前todo.html代码如下: <!DOCTYPE html> <html ng-app=&quo ...
- qt qml ajax 获取 json 天气数据示例
依赖ajax.js类库,以下代码很简单的实现了获取天气json数据并展示的任务 [TestAjax.qml] import QtQuick 2.0 import "ajax.js" ...
- Jquery 模板插件 jquery.tmpl.js 的使用方法(1):基本语法,绑定,each循环,ajax获取json数据
jquery.tmpl.js 是一个模板js ,主要有2个方法 (1):$.template()方法,将一段script或者是Html编译为模板,例如 $.template('myTemplate' ...
- ajax获取json数据及实现跨域请求
最近想练习一下ajax获取json数据 , 首先上网找一些在线的可用来测试的接口. -----------------------------------------------------这里是接口 ...
- JS-利用ajax获取json数据,并传入页面生成动态tab
封装好的:ajax.js function ajax(url, fnSucc,fnFaild){ //1[创建] if(window.XMLHttpRequest){ var oAjax = new ...
- jQuery中使用Ajax获取JSON格式数据示例代码
JSON(JavaScript Object Notation)是一种轻量级的数据交换格式.JSONM文件中包含了关于“名称”和“值”的信息.有时候我们需要读取JSON格式的数据文件,在jQuery中 ...
随机推荐
- 【转】Android的线程使用来更新UI----Thread、Handler、Looper、TimerTask
方法一:(java习惯,在android不推荐使用) 刚刚开始接触android线程编程的时候,习惯好像java一样,试图用下面的代码解决问题 new Thread( new Runnable() { ...
- Basic Calculator,Basic Calculator II
一.Basic Calculator Total Accepted: 18480 Total Submissions: 94750 Difficulty: Medium Implement a bas ...
- c++多线程参数的传递
#include <iostream> #include <pthread.h> //多线程相关操作头文件,可移植众多平台 using namespace std; struc ...
- vc++ internet
1.用VC开发ActiveX文档服务器 MFC 4.2不支持开发ActiveX容器,但支持ActiveX服务器.只要在使用MFC AppWizard生成应用程序框架时选择支持Active Docume ...
- javascript的调试
1. 关于javascript的调试,最好将浏览器的脚本通知打开. 2. 最好设置为每次访问页面时检查.
- js获取时间和日期,字符串和时间戳之间的转换
//获取当前时间: var myDate = new Date();//当前时间 var year = myDate.getFullYear();//当前年份 var month = myDate.g ...
- jQuery无缝滚动向上
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- HCE:Host-based Card Emulation基于Android设备的卡片模拟器
HCE技术支持提供了一个软实现SE的通路,Service实现的方式很多,可以使用文件,使用网络,甚至连接真正的SE.支持HCE的测试手机:目前可以确定使用了NXP PN547作为CLF的NFC手机已经 ...
- JD-GUI on Ubuntu 13.04 64-bit
Java Decompiler (jd-gui) is a cute little tool I like using when working in Java. Unfortunately it o ...
- 关于写的Java书籍进展
大家好,去年说要写本Java书,近期就快出版了.眼下已经開始打印样书了,最快于本月中旬左右就能够在互动网www.china-pub.com上看到消息,其它各个站点何时会发售要看详细进货情况. 去年我预 ...