对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 ...
随机推荐
- mysql查看修改字符集
1.列出MYSQL支持的所有字符集: SHOW CHARACTER SET; 2.当前MYSQL服务器字符集设置 SHOW VARIABLES LIKE 'character_set_%'; 3.当前 ...
- Java 打印堆栈的几种方法 Exception
Exception e = new Exception("this is a log"); e.printStackTrace(); //延迟才可以看出效果 Thread.curr ...
- 8.mvc core上传文件
以下方法均是个人,仅供参考 public interface IFileHelper { /// <summary> /// 保存文件 (返回 Test.jpg) 出错就返回 error| ...
- apache服务器安装以及使用passenger插件部署rails应用
小例子可以部署在rails自带的WEBrick上,逐渐往后走还得上Apache. 安装apache服务器 命令是sudo apt-get install apache2 安装passenger插件 安 ...
- 采用MANIFEST.MF之jar报错ClassNotFoundException解法
检查n多遍也试了n多次,证明下面是MANIFEST.MF文件正确写法: Manifest-Version: 1.0 Premain-Class: cn.yandz.monitor.SizeOfObje ...
- MySQL AHI 实现解析
版权声明:本文由musazhang原创文章,转载请注明出处: 文章原文链接:https://www.qcloud.com/community/article/904925001482373849 来源 ...
- 有关sublime text的插件安装
.sumblime text 中的package control 插件包控件的安装步骤一: Ctrl+` 调出console 粘贴代码: import urllib2,os; pf='Pa ...
- [mysql] 记osx 10.10系统修改mysql root 密码
http://dev.mysql.com/doc/refman/5.7/en/resetting-permissions.html亲测方法3,已成功重置密码.(感谢@非常,告诉我官网就有重置方法,网上 ...
- 使用Kylin构建企业大数据分析平台的4种部署方式
本篇博客重点介绍如何使用Kylin来构建大数据分析平台.根据官网介绍,其实部署Kylin非常简单,称为非侵入式安装,也就是不需要去修改已有的 Hadoop大数据平台.你只需要根据的环境下载适合的Kyl ...
- Jekyll x Liquid 控制文章列表只显示特定类别的Post
使用Liquid按照Category或者Tag过滤Post List 文章首发于szhshp的第三边境研究所(szhshp.org), 转载请注明 前段时间画了一些漫画,考虑把漫画相关的Post放到另 ...