jquery实现下拉联动
很多项目用到这个功能,虽然写了不下5次以上了,一直没做过记录,记录一下,下次直接拷贝了,免得还得要重复写浪费时间。
先上HTML代码:
品牌:
<select class="sa" id="zxpp" style="width: 120px">
<option value="">--请选择--</option>
<option value="1">test</option>
</select> 规格:
<select class="sa" id="zxgg" style="width: 150px">
<option value="">--请选择--</option>
</select>
JS代码:
/**
select的change事件处理函数
*/
function changeKey(){
$.ajax({
type:"POST",
url: "xx.do",
data: "action=xx&key="+this.value,
dataType:"json",
success: function(jsonObj){
fillSelect(jsonObj,this);
},
error : function(XMLHttpRequest, textStatus, errorThrown) {
if(401==XMLHttpRequest.status){
alert("请登陆后再操作!");
window.top.location.href = basepath + "login.jsp";
}else{
alert("服务器发生错误,请联系系统管理员!");
}
}
});
}
/**
填充select的值
*/
function fillSelect(data,elementObj){
var text = "<option value=''>请选择</option>";
for(var i=0,len=data.length; i<len; i++){
text += "<option value='"+data[i][0]+"'>"+data[i][1]+"</option>";
}
$(elementObj).empty();
$(elementObj).html(text);
} $(document).ready(function(){
$("#zxpp").change(changeKey);
});
上面的代码是从项目里拷贝修改而来,可能会存在点小问题,不保证拿过去就能运行。
jquery实现下拉联动的更多相关文章
- Jquery Json 下拉联动
#region dataTable转换成Json格式 /// <summary> /// dataTable转换成Json格式 /// </summary> /// <p ...
- Jquery实现下拉联动表单
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jquery div 下拉框焦点事件
这章与上一张<jquery input 下拉框(模拟select控件)焦点事件>类似 这章讲述div的焦点事件如何使用 div的焦点事件与input的焦点事件区别在于 需要多添加一个属性: ...
- Jquery操作下拉框(DropDownList)实现取值赋值
Jquery操作下拉框(DropDownList)想必大家都有所接触吧,下面与大家分享下对DropDownList进行取值赋值的实现代码 1. 获取选中项: 获取选中项的Value值: $('sele ...
- jQuery水平下拉菜单实现
<!DOCTYPE html> <html> <head> <title>jQuery水平下拉菜单实现</title> ...
- jquery 获取下拉框值与select text
下面先介绍了很多jquery获取select属性的方法,同时后面的实例我们讲的是jquery 获取下拉框值与select text代码. 下面先介绍了很多jquery获取select属性的方法,同时后 ...
- jQuery对下拉框Select操作总结
jQuery对下拉框Select操作总结 转自网络,留做备用 jQuery获取Select元素,并选择的Text和Value: 1. $("#select_id").change( ...
- js,jquery获取下拉框选中的option
js获取select选中的值: var sel=document.getElementById("select1"); var index = sel.selectedIndex; ...
- 一款基于jquery的下拉点击改变背景图片
今天给大家介绍一款基于jquery的下拉点击改变背景图片.单击右上角的图片,下拉显示可选择的背景图片,单击图片变为背景图.效果图下: 在线预览 源码下载 实现的代码. html代码: <a ...
随机推荐
- HTTP的KeepAlive是开启还是关闭?
HTTP的KeepAlive是开启还是关闭? http://itindex.net/detail/50719-http-keepalive 1.KeepAlive的概念与优势 HTTP的KeepAli ...
- datagrid在MVC中的运用02-结合搜索
本文接着上一篇,来体验给datagrid加上搜索功能.主要涉及到: ※ 把一个div与datagrid相关起来 ※ datagrid接收查询参数 ※ 查询参数的封装 效果图: 查询参数封装 分页相关的 ...
- Android图片加载框架最全解析(七),实现带进度的Glide图片加载功能
我们的Glide系列文章终于要进入收尾篇了.从我开始写这个系列的第一篇文章时,我就知道这会是一个很长的系列,只是没有想到竟然会写这么久. 在前面的六篇文章中,我们对Glide的方方面面都进行了学习,包 ...
- connection to sys should be as sysdba or sysoper 解决的方法
连接时提示: 出现了例如以下的情况:EXP-00056;遇到ORACLE错误28009. ORA-28009:connection to sys should be as sy ...
- C语言:内存的分配与管理
1.内存区域的划分标准: 代码段 存储代码 数据段 静态/全局数据.常量(const) 堆区(heap) 动态内存分配(更 ...
- mahout源码分析之DistributedLanczosSolver(五)Job over
Mahout版本:0.7,hadoop版本:1.0.4,jdk:1.7.0_25 64bit. 1. Job 篇 接上篇,分析到EigenVerificationJob的run方法: public i ...
- 掌握Sed命令
带书签PDF版,喜欢的话,欢迎多提意见和建议,你的支持是血蝙蝠最大的前进动力! http://download.csdn.net/detail/challenge_c_plusplus/6480007 ...
- python部分重点底层源码剖析
Python源码剖析—Set容器(hashtable实现) python源码剖析(内存管理和垃圾回收)
- Best Time to Buy and Sell Stock III leetcode java
题目: Say you have an array for which the ith element is the price of a given stock on day i. Design a ...
- .Net应用程序打包部署总结
编译源代码并完成测试以后,开发过程其实并没有结束.在这个极端,需要把应用程序提供给用户.无论是ASP.NET应用程序,客户端应用程序还是 Compact Framework构建的应用程序,开发出来的软 ...