本文实例讲述了jQuery实现输入框下拉列表树插件。分享给大家供大家参考。具体如下：这是一款基于jquery实现的下拉列表树插件源码，是一款实用的jquery树形下拉框下拉树代码。点击文本框即可弹出树形下拉列表，单击列表项即可选中列表对应文字，是一款非常实用的特效源码。运行效果图： - 查看效果下载源码-

小提示：浏览器中如果不能正常运行，可以尝试切换浏览模式。为大家分享的jQuery实现输入框下拉列表树插件代码如下

hearteta http-equiv=' Content-Type ' Content=' text/html；charset=utf-8' /titlejQuery实现输入框下拉列表树插件代码/title link href=' CSS/dtreeck。' CSS '类型=' text/CSS ' rel='样式表/床头！-代码部分开始-表格宽度=' 100% ' align=' center '单元格边距=' 0 '单元格间距=' 0 ' tr TD colspan=' 1 ' valign=' top ' width=' 35% ' style=' padding-left : 30px；'/TD TD valgn=' top ' height=' 65% ' align=' left ' form method=' post ' id=' regform ' table width=' 70% '单元格填充=' 1 '单元格间距=' 0 '边框=' 0 ' style=' margin-top : 10px；'tr td宽度='20% '对齐='右'父菜单：/TD TD TD宽度='30%' align='left '输入类型=' text ' id=' menu _ parent _ name ' style=' width : 150 px；'输入类型=' hidden ' id=' menu _ parent ' name=' menu _ parent '输入类型=' hidden ' id=' oprate ' name=' oprate '输入类型=' hidden ' id=' menu _ id ' name=' menu _ id '/TD TD宽度=' 20% ' align=' right '/TD TD宽度=' 30% ' align=' left '/TD/tr/table/form/TD/tr/table脚本src=' http 3360http://www。兰伦阿智.id='closed'font color='#000 '关闭/font/a/div脚本src=' http : js/lanren。js '/脚本/div脚本//生成弹出层的代码！-弹出层-xOffset=0；//向右偏移量yOffset=25//向下偏移量var toshow=' treediv//要显示的层的idvar target=' menu _ parent _ name '；//目标控件-也就是想要点击后弹出树形菜单的那个控件id $("# "目标)。单击(function (){ $('#' toshow).css('位置'，'绝对').css('left '，$('#' target).位置()。左xOffset 'px ').css('top '，$('#' target).位置()。顶级yOffset ' px ' .show()；});//关闭层$('#closed ').单击(function(){ $('#' toshow).hide()；});//判断鼠标在不在弹出层范围内函数钦(id){ var YY=20；//偏移量var str=var x=窗口。事件。客户x；var y=窗口。事件。客户关系；var obj=$(' # ' id)[0]；if(xobj。offsetleftx(obj。偏移物体。客户端宽度)y(obj。YY)y。偏移位置。客户端高度)){返回true} else { return false} } //点击身体关闭弹出层$(文档)。click(function(){ var is=ChIN(' tree div ')；if(！is){ $(“#”to show).hide()；} });-弹出层- //生成弹出层的代码//点击菜单树给文本框赋值-菜单树里加此方法函数setvalue(id，name){ $('#menu_parent_name ').val(名称);$('#menu_parent ').val(id)；$('#treediv ').hide()；}/脚本！-代码部分end/body/html以上就是为大家分享的jQuery实现输入框下拉列表树插件代码，希望大家可以喜欢。