jqurey ajax 的动态添加二级联动下拉菜单
![](/assets/blank.gif)
![](/assets/blank.gif)
<div id="Attribute"> 添加类型:<span class="oper"> <a href="javascript:void(0);" οnclick="s()">[+]</a></span> </div>
![](/assets/blank.gif)
![](/assets/blank.gif)
<script type="text/javascript"> function post(data, f) { $.post("InputGoodType.aspx", data, f); } function ld(obj) {var id = obj.getElementsByTagName("select")[0].value; post("type=drop2&id=" + id, function (r) { obj.getElementsByTagName("span")[1].innerHTML = CreateSelect(eval(r)); }) } function s() {var div1 = document.getElementById("Attribute"); div = document.createElement("div"); div1.appendChild(div); post("type=drop", function (r) {var span = document.createElement("span");var span1 = document.createElement("span"); span.innerHTML = CreateSelect(eval(r), 1); div.innerHTML = "<a href=\"javascript:void(0);\" οnclick=\"remove(this)\">[-]</a>"; div.appendChild(span); div.appendChild(span1); ld(div); }) } function CreateSelect(arr, number) { var str = "<select style=\"width:200px;\" name=\"att\">";if (number != undefined) { str = "<select οnchange=\"ld(this.parentNode.parentNode)\" style=\"width:200px;\">"; }for (var i = 0; i < arr.length; i++) { str += "<option value="+arr[i][0]+">"+arr[i][1]+"</option>" } str += "</select>";return str; } function remove(obj) { obj.parentNode.parentNode.removeChild(obj.parentNode); } </script>
![](/assets/blank.gif)
![](/assets/blank.gif)
protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) {if (Request["type"] == "drop") { Response.Write(DorpDowenlistBind()); Response.End();return; }if (Request["type"] == "drop2") { Response.Write(Drop2list()); Response.End();return; } }} ///<summary>/// 下来菜单数据项绑定///</summary> protected string DorpDowenlistBind() { StringBuilder strSql = new StringBuilder(); strSql.Append("["); DataTable dt = GClassManager.GetAllList().Tables[0];//获取数据源 foreach (DataRow dr in dt.Rows) { strSql.AppendFormat("[\"{0}\",\"{1}\"],", dr["GclassID"], dr["GclassName"]); } strSql.Append("]");return strSql.ToString().Replace(",]", "]"); }///<summary>/// 下来菜单数据项绑定///</summary> protected string Drop2list() { DataTable dt = new DataTable();if (Request.Form["id"] == null) { dt = AttributeManager.GetAllList().Tables[0]; }else { dt=AttributeManager.GetList("ClassId=" + Request.Form["id"].ToString() + "").Tables[0]; } StringBuilder strSql = new StringBuilder(); strSql.Append("[");foreach (DataRow dr in dt.Rows) { strSql.AppendFormat("[\"{0}\",\"{1}\"],",dr["AttributeId"],dr["AttributeName"]); } strSql.Append("]");return strSql.ToString().Replace(",]","]"); }
注:把js放在页面的的尾部
广告:亲爱程序员们,工作之余也要注意休息一下哦。喝点水(多喝水的好处不用多说吧),闭闭眼(缓解眼睛酸涩),走一走(小心pp长痘痘),长期面对电脑不担心有辐射(脸上会有斑哦)。有空关注一下微信号kopania,她是一个程序媛,也许不能解答你(高手)的技术问题,但是可以解决你的肌肤问题。是一个对护肤品成分深有研究的人,可以帮你分析你现在所用的护肤品成分是否安全有效。
转载于:https://www.cnblogs.com/piaobodehongmu/archive/2011/10/31/2229801.html
jqurey ajax 的动态添加二级联动下拉菜单相关推荐
- addoption php,无忧建站-ajax+php无刷新二级联动下拉菜单(省市联动)源码
/** * ajax无刷新二级联动下拉菜单(省市联动) * * @author arcow * @version 1.0 * @lastupdate 2005-12-29 * */ ...
- php下拉列表 二级 联动,PHP+Ajax实现二级联动下拉菜单!
正文 字体大小: 中 PHP+Ajax实现二级联动下拉菜单! (2009-12-05 01:11:39) 标签: 杂谈 数据库 .................................... ...
- popwindow下拉筛选 二级联动_职场人必备!一分钟搞定Excel二级联动下拉菜单
对于一级下拉菜单的设置,相信经常使用Excel的用户都不陌生,那么,二级联动下拉菜单又是什么呢?与一级下拉菜单有什么关系呢? 二级联动下拉菜单是根据一级下拉菜单内容的变化而变化的.大家都知道,不同的部 ...
- 下拉默认选择_在Excel中制作二级联动下拉菜单,太有用了
对于一级下拉菜单的设置,相信经常使用Excel的用户都不陌生,那么,二级联动下拉菜单又是什么呢?与一级下拉菜单有什么关系呢? 二级联动下拉菜单是根据一级下拉菜单内容的变化而变化的.大家都知道,不同的部 ...
- javascript实现下拉条联动_js实现select二级联动下拉菜单
本文实例为大家分享了js实现select二级联动下拉菜单,供大家参考,具体内容如下 String path = request.getContextPath(); String basePath = ...
- dw二级联动下拉菜单插件 宋君墨_Excel下拉菜单不会做?15秒教会你制作一二三级联动下拉菜单,从此做表不求人!...
Hi,各位叨友们好呀!我是叨叨君~ 我们都知道,在使用Excel表格统计数据的时候,为了方便录入,通常会在Excel中设置下拉菜单,以便我们输入相同的内容. 那么,Excel中一级.二级.三级联动下拉 ...
- JavaScript实现二级联动下拉菜单
最近学习前端js,做了一个二级联动下拉菜单.二级下拉菜单的内容随着一级下拉菜单选项的更改而更改.菜单的内容是手动存在js的数组里的,随便写了几个数据. 效果图: 实现源码: <!DOCTYPE ...
- jquery二级联动下拉菜单
二级联动下拉菜单选择应用在在很多地方,比如说省市下拉联动,商品大小类下拉选择联动.本文将通过实例讲解使用jQuery+PHP+MySQL来实现大小分类二级下拉联动效果. 先看下效果 大类: 前端技术 ...
- php ajax联动下拉列表,PHP和Ajax实现二级联动下拉菜单(代码、详细注释)
数据库 ................................................................................................ ...
最新文章
- 不同的PCB混装方式及加工工艺
- 一种绕过Android P对非SDK接口限制的简单方法
- DM8168 新三板系统启动
- AT1981-[AGC001C]Shorten Diameter
- [html] web workers有用过吗?能帮我们解决哪些问题?
- 【转】ABP源码分析三十四:ABP.Web.Mvc
- java a星寻路算法_用简单直白的方式讲解A星寻路算法原理
- nio java是什么_Java NIO 的前生今世 之一 简介
- 防暴力破解一些安全机制
- asp.net MVC中怎样让LINQ Designer自动生成的类从别的类继承并调用其基类构造器?...
- 新一代视频编解码标准正式公布!
- jQuery拖动调整表格列宽度-resizableColumns
- 拳皇觉醒服务器维护,拳皇觉醒手游预约_腾讯拳皇觉醒新版v1.0.0_第一手游网
- 重装系统备份找不到镜像文件_如何从Windows 7系统映像备份中提取单个文件
- 大数据和云计算技术周报(第102期)
- 用Python搞定豆瓣上征婚交友的小姐姐们~
- SpringBoot接口数据加解密实战
- 计算机游戏性能测评,游戏性能测试
- Viper的使用方法
- 百度地图SDK配置与使用
热门文章
- 语义分割未来发展如何?
- 人脸检测江湖的那些事儿——从旷视说起
- 收藏 | 计算机视觉中的自注意力
- 重磅 | 华为自动驾驶团队公开招聘!
- 《Python编程从入门到实践》记录之类继承
- java图片预览上传_java实现文件上传、下载、图片预览
- 第三章 函数 C++语言程序设计第五版 - 郑莉
- 算法每日一题--分治算法(一)-李富贵要上岸985
- 两种方法解决pip、conda安装库时慢的问题
- Tensorflow教程: tf.Variable() 和tf.get_variable()