jqurey ajax 的动态添加二级联动下拉菜单
<div id="Attribute"> 添加类型:<span class="oper"> <a href="javascript:void(0);" οnclick="s()">[+]</a></span> </div>
<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>
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实现二级联动下拉菜单(代码、详细注释)
数据库 ................................................................................................ ...
最新文章
- EOS共识机制——DPoS代理权益证明
- python训练模型函数参数_一步步亲手用python实现Logistic Regression
- 搭建SVN版本控制服务器
- aws搭建java项目_AWS下S3之java开发
- 论文被拒稿后怎么办?这些事情你要知道
- 在加拿大读大学被开除了,以后该怎么办?
- ssm+maven+eclipse框架搭建
- android自定义图片过渡效果,教你做出炫酷的Android动画效果
- html5历史纪录管理,HTML 5 新增方法以及历史管理
- 01web前端笔试试题
- 二阶魔方万能还原公式_魔方小站二阶魔方速拧《2阶魔方公式 视频教程》
- mysqld.exe 无法找到入口
- html5简单拼图游戏,HTML5拼图游戏
- 烂笔头投资日记20221212
- 终于把python的所有库整理完毕了,现在一篇python库的字典诞生了
- SQL语法 自然连接 外连接 内连接
- dex分包方案概述与multidex包的配置使用
- 头脑风暴法利用计算机让大家进行思想交流,个人与团队管理期末复习
- 【专题】三分法和牛顿迭代法总结
- @程序员:GitHub这个项目快薅羊毛
热门文章
- 克服Dropout缺陷,简单又有效的正则方法:R-Drop
- 能“看穿”换脸视频背后的AI模型,Facebook的反Deepfake方法有点东西
- Transformer 杀疯了,图像去雨、人脸幻构、风格迁移、语义分割等通通上分
- 玩了5万局游戏,英伟达让GameGAN自己生成「吃豆人」,世界首创无需游戏引擎...
- 文末送书|增强现实:原理与实践
- Java进阶之路——从初级程序员到架构师,从小工到专家必会的技能
- 学计算机三本大学最低分数线,2018三本大学最低录取分数线是多少
- Numpy基础知识点汇总
- find python列表_Python基础知识(7)list列表各种操作
- 前端代码获取文件大小_vue技术栈前端建设方案