Select标签下拉列表二级联动级联
首先从服务器端,绑定下拉列表,二级下拉的text命名按照一定规则加上一级下拉的ID。
var options=new Array();
$(document).ready(function(){
//二级联动
$('#ddlPages').children('option').each(function(i){
options[i]='<option value="'+$(this).val()+'">'+$(this).text()+'</option>';
});//将option列表放到数组里
$('#ddlPages option:gt(0)').remove(); //清楚下拉
$('#ddlSubsystems').bind('change',function(){ //注册事件
var systemname=$('#ddlSubsystems option:selected').text();
for(var j=0;j<options.length;j++){
$('#ddlPages').append(options[j]);
} //option列表先初始化
$('#ddlPages option:gt(0)').each(function(i){ //遍历排除
var textname=$(this).text();
var index=textname.indexOf('-'+systemname);
if(index<0){
$(this).remove();
}else{
$(this).text(textname.substring(0,index));
}
});
$('#ddlPages').val(0); //默认选中第一行
});
});
Select标签下拉列表二级联动级联的更多相关文章
- 如何用jstl的select标签做二级联动下拉列表框??
下拉列表框的多级联动早就会了.但是用jstl的select标签做下拉列表框的做二级联动的时候还是遇到了些问题.主要问题在用Ajax查询到的数据如何拼成下拉选项的时候.其实很简单,但我还是折腾了好久.所 ...
- select标签实现二级联动
效果如下图所示: 实现的原理:使用onchange事件,原理见代码 html代码: <select id="select" class="sel"> ...
- jQuery下拉列表二级联动插件
jQuery下拉列表二级联动插件的视图代码: <!doctype html> <html lang="en"> <head> <meta ...
- Mybatis + js 实现下拉列表二级联动
Mybatis + js 实现下拉列表二级联动 学习内容: 一.业务需求 二.实现效果 三.代码实现 1. province_city.jsp 2. TwoController 2. Province ...
- <select>简易的二级联动
1.首先是表单页面: <tr> <td align="right"> <label class="Validform_label" ...
- select菜单实现二级联动
<tr> <th>执行人<b>*</b></th> <td> <select name="jdcld.ZXDW& ...
- select下拉二级联动
function opt(){ var id = $("#ids").val(); $.ajax({ type: "POST", url: "$ ...
- jQuery 1.3.2 简单实现select二级联动
jQuery 1.3.2 简单实现select二级联动 复制代码代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transiti ...
- 通同select便签实现简单的二级联动
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- 在Windows Server 2012 R2上安装SharePoint 2013 with SP1失败,提示没有.net4.5的解决办法
现在的Server用Windows Server 2012 R2的越来越多了,在部署带Sp1的SharePoint2013的时候,走完预安装工具后,点击setup提示缺少.net4.5. 其实Wind ...
- VMware网络设置详解
标签: 网络vmware虚拟机web服务network 2009-05-19 22:23 27537人阅读 评论(7) 收藏 举报 分类: 基于类linux的开发(171) 我们知道,VMwareWo ...
- js版弹力球实例
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>弹 ...
- Ubuntu 14.10安装手记
1. Ubuntu系统安装 按照 www.linuxidc.com/Linux/2014-04/100369.htm 的安装方法即可. 配置文件有两个需要注意的地方.一.搞清楚电脑的分区表,c盘是hd ...
- ssh项目将搜索条件进行联动
<s:form namespace="/tb" action="tenderList" name="searchForm" id=&q ...
- jquery生成元素注册事件无效,及事件委托的使用
在页面加载完成之后,我们在页面操作用js生成html代码到页面,动态的添加元素带页面上 但是,这里可能很多人就必须碰到的一个问题就出现了,当你之后动态添加了元素到页面上,发现这个元素的绑定事件无效,如 ...
- JDK安装,环境配置
在安装完jdk后,还需要对jdk的环境变量进行配置才能正常使用 1.右键选择 计算机→属性→高级系统设置→高级→环境变量 2.系统变量→新建 变量名:JAVA_HOME 变量值:(变量值填写你的jdk ...
- jQuery动态增删改查表格信息,可左键/右键提示
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- mysql命令总结
统计全库数据量: use information_schema; SELECT TABLE_NAME, (DATA_LENGTH) as DataM , (INDEX_LENGTH) as Index ...
- 面试题目——《CC150》栈与队列
面试题3.1:描述如何只用一个数组来实现三个栈. 方法1:固定分割 方法2:弹性分割(较难) package cc150; public class ArrayStack { public stati ...