easyui中combobox级联的实现

级联下拉框实现

最新推荐文章于 2025-11-30 22:49:23 发布

原创最新推荐文章于 2025-11-30 22:49:23 发布 · 511 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#jquery #combo box #easyui #级联

本文介绍了一种使用jQuery实现级联下拉框的方法。通过设置不同级别的onSelect事件，动态加载下一个级别的下拉选项，适用于线名、行别、站所等多层次选择场景。

最近在开发中遇到了下拉框级联的问题，目前的解决办法如下：

jsp中需要级联输入的是如下三个字段，其中关系依次是:线名、行别、站所

这里我们用jquery来实现这三个字段的级联输入：

<script>
$(function() {
$('#xm').combobox({
url : 'Software_VersionM-getXm.action',
valueField : 'text',
/*第一级：线名的onSelect()方法，用于定义第二级下拉框 */
onSelect : function(rec) {				
var xm = rec.text;
$('#xb').combobox({						
url:'Software_VersionM-getXb.action?xm='+xm,
valueField:'text',	
/*第二级：行别的onSelect()方法，用于定义第三级下拉框  */
onSelect : function(rec) {
$('#zs').combobox({
url:'Software_VersionM-getZs.action?xb='+rec.text+'&xm='+xm,
valueField:'text'		
});			
}				
});			
}	
});
});
</script>

希望对大家有所帮助！