对jQuery ajax三级级联的简单研究
最近写程序的时候经常遇到使用ajax获取数据的问题,刚好昨天遇到ajax写三级级联问题,自己写了一个简单的级联。对于服务端获取数据的就不多写了,客户端的ajax发送请求我在这里详细说一下,因为我也没专门学过jQuery的ajax也都是在网上看的资料,希望我的理解对大家有帮助吧。
<script type="text/javascript">
var ctx = '<%=request.getContextPath()%>';
//获取一级职位分类
window.onload=function(){
$.ajax({
url:ctx+'/hr/base/job/queryJobLevel1.htm',
type:'post',
contentType:"application/json",
data:'{}',
dataType:'json',
success:function(data) {
$("#level1").empty();
$("#level1").append("<option value=''>请选择职位类型</option>");
for(var i=0;i<data.data.length;i++){
$("#level1").append("<option value='"+data.data[i].id+"'>"+data.data[i].name+"</option>");
}
},
error : function() {
alert("异常!");
}
});
}
function addSub(value){
if(""!=value){
$.ajax({
url:ctx+'/hr/base/job/queryJobLevel2.htm',
type:'post',
contentType:"application/json",
data:'{rid:value}',
dataType:'json',
success:function(data) {
$("#level2").empty();
$("#level2").append("<option value=''>请选择职位类型</option>");
for(var i=0;i<data.data.length;i++){
$("#level2").append("<option value='"+data.data[i].id+"'>"+data.data[i].name+"</option>");
}
},
error : function() {
alert("异常!");
}
});
}
}
function addSub2(value){
if(""!=value){
$.ajax({
url:ctx+'/hr/base/job/queryJobLevel3.htm',
type:'post',
contentType:"application/json",
data:'{rid:value}',
dataType:'json',
success:function(data) {
$("#level3").empty();
for(var i=0;i<data.data.length;i++){
$("#level3").append("<option value='"+data.data[i].id+"'>"+data.data[i].name+"</option>");
}
},
error : function() {
alert("异常!");
}
});
}
}
做了三个下拉框,好像这样的比较简单一些。
之前研究了很久,做完才发现其实也不是特别的难,希望对大家有帮助。
对jQuery ajax三级级联的简单研究的更多相关文章
- jquery ajax请求后台 的简单例子
jQuery.ajax(url,[settings]) 概述 通过 HTTP 请求加载远程数据. jQuery 底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等.$.ajax ...
- jQuery学习之jQuery Ajax用法详解
jQuery Ajax在web应用开发中很常用,它主要包括有ajax,get,post,load,getscript等等这几种常用无刷新操作方法,下面我来给各位同学介绍介绍. 我们先从最简单的方法看起 ...
- jQuery学习之jQuery Ajax用法详解(转)
[导读] jQuery Ajax在web应用开发中很常用,它主要包括有ajax,get,post,load,getscript等等这几种常用无刷新操作方法,下面我来给各位同学介绍介绍.我们先从最简单的 ...
- [转]Jquery Ajax用法
原文地址:http://www.php100.com/html/program/jquery/2013/0905/6004.html jQuery学习之jQuery Ajax用法详解 来源: 时间 ...
- jQuery Ajax用法
jQuery Ajax在web应用开发中很常用,它主要包括有ajax,get,post,load,getscript等等这几种常用无刷新操作方法,下面我来给各位同学介绍介绍. 我们先从最简单的方法看起 ...
- jQuery学习之jQuery Ajax用法详解(转)
jQuery Ajax在web应用开发中很常用,它主要包括有ajax,get,post,load,getscript等等这几种常用无刷新操作方法,下面我来给各位同学介绍介绍. 我们先从最简单的方法看起 ...
- (高级篇)jQuery学习之jQuery Ajax用法详解
jQuery Ajax在web应用开发中很常用,它主要包括有ajax,get,post,load,getscript等等这几种常用无刷新操作方法,下面我来给各位同学介绍介绍. 我们先从最简单的方法看起 ...
- [C#]使用 C# 代码实现拓扑排序 dotNet Core WEB程序使用 Nginx反向代理 C#里面获得应用程序的当前路径 关于Nginx设置端口号,在Asp.net 获取不到的,解决办法 .Net程序员 初学Ubuntu ,配置Nignix 夜深了,写了个JQuery的省市区三级级联效果
[C#]使用 C# 代码实现拓扑排序 目录 0.参考资料 1.介绍 2.原理 3.实现 4.深度优先搜索实现 回到顶部 0.参考资料 尊重他人的劳动成果,贴上参考的资料地址,本文仅作学习记录之用. ...
- php+jquery+ajax+json简单小例子
直接贴代码: <html> <title>php+jquery+ajax+json简单小例子</title> <?php header("Conte ...
随机推荐
- Netsuite订单审核问题
销售订单审核自动发送邮件问题: 销售订单界面有“提交审核”按钮,点击提交后会自动发送邮件给审核人,这个审核人可以实现指定发送给销售团队中的“主要”成员吗? Options - 在邮件系统中, 定义那个 ...
- easyUI-combobox 动态绑定数据源
前台 <link rel="stylesheet" type="text/css" href="../css/easyui.css"/ ...
- javascript 字符串多行的写法
多行写法! $('#' +xx ).append ( '<div id="' + file.id + '" class="">\ <div c ...
- XMLHttpRequest简介
要真正实现这种绚丽的奇迹,必须非常熟悉一个 JavaScript 对象,即 XMLHttpRequest. 下面给出将要用于该对象的很少的几个 方法和属性. ·open():建立到服务器的新请求. · ...
- VB类模块中属性的参数——VBA中Range对象的Value属性和Value2属性的一点区别
在VB中,属性是可以有参数的,而VBA中属性使用参数非常常见.比如最常用的:Worksheet.Range("A1:A10") VB的语法,使用参数的不一定是方法,也有可能是属性 ...
- ShareSDK 集成 Google+ 登录 400. Error:redirect_uri_mismatch 和 Error Domain=ShareSDKErrorDomain Code=204
最近在集成ShareSDK中 Google+ 登录授权时候 出现了如下几个问题 1. 400. Error:redirect_uri_mismatch 出现这种情况, redirectUri应 ...
- Codeforces 722C. Destroying Array
C. Destroying Array time limit per test 1 second memory limit per test 256 megabytes input standard ...
- Javascript中的链表
function LinkedList() { // 辅助类,表示加入链表的每一项 var Node=function(element){ this.element=element; this.nex ...
- Nginx
Nginx的常识 1.nginx三大功能:(百万级别繁忙服务器占有率) 1)web服务器 轻量级,处理的并发量更大. 2)反向代理服务器 通过将用户端的请求,透明的转送给应用服务器.这样所 有的客户端 ...
- go排序
补注: 近来又看 go 的排序, 发现以前对 go 的排序理解的有点浅了. go 的排序思路和 c 和 c++ 有些差别. c 默认是对数组进行排序, c++ 是对一个序列进行排序, go 则更宽泛一 ...