【select级联】一种新的方法

最新推荐文章于 2023-08-22 13:56:05 发布

丫头嗳

最新推荐文章于 2023-08-22 13:56:05 发布

阅读量542

点赞数

CC 4.0 BY-SA版权

分类专栏： JAVA

本文链接：https://blog.youkuaiyun.com/enkezhang/article/details/7709348

JAVA 专栏收录该内容

12 篇文章

订阅专栏

本文介绍了一种不同于AJAX的级联选择实现方法，通过使用JavaScript和JSP技术，在选择用户组时动态加载对应的用户列表。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

今天学到了另一种级联选择【类似于选择了省就把该省的下一级地区加载出来】操作的方法，以前都是用ajax做的，现在跟着师父又学到了一种方式，留着，以后用得着。(*^__^*) 嘻嘻

其实原理和ajax的一样，返回的是结构化数据。本代码功能实现的是选择用户组时加载出该用户组下的用户

js如下：

var orderDoc = new ActiveXObject("Microsoft.XMLDOM");

orderDoc.async = "false";

function queryUser() {

var k = infoForm.group_id;

orderDoc.load("<%=request.getContextPath()%>/taskAction.do?method=getUserBygroup&group_id="+ infoForm.group_id.value); //这里action查询方法返回到userList.jsp 页面

var items = orderDoc.getElementsByTagName_r("userTag");

alert(items);

if (infoForm.userid.length > 0) {

for (i = infoForm.userid.length - 1; i >= 0; i--) {

infoForm.userid.remove(i);

}

document.infoForm.userid.add(document.createElement_x("OPTION"));

var kk = "";

for (i = 0; i < items.length; i++) {

document.infoForm.userid.add(document.createElement_x("OPTION"));

document.infoForm.userid.options[i + 1].value = items.item(i)

.attributes(1).nodeValue;

document.infoForm.userid.options[i + 1].text = items.item(i)

.attributes(0).nodeValue;

kk == document.infoForm.userid.options[i + 1].value

}

主要部分jsp：放在form里面，form名称：上面的infoForm

</option>
</logic:iterate>
</select>
</td>
</tr>

userList.jsp页面

<%@ page language="java" contentType="text/html;charset=UTF-8" import="java.util.*,com.mvtech.yq.app.bean.User"%>

<%@ page import="java.util.List"%>

<%@ page import="java.text.*"%>

<?xml version="1.0" encoding="UTF-8"?>

<root>

List list = (List)request.getAttribute("userList");

if(list==null)list = new ArrayList();

for(int i=0;i<list.size();i++){

User user=(User)list.get(i);

<userTag display="<%=user.getUsrname()%>" value="<%=user.getUsrid()%>" />

<%}%>

</root>

个人觉得不好的一点就是这个需要多写一个结果数据页面，ajax里直接在方法里搞定了。