new Option的一个例子

       在做级联查询的时候用到的, 两个select和一个查询button,点击第一个select列出所有部门(比如采购部、新闻部),点击某一分类之后(比如采购部),第二个select动态创建该分类下的数据项(比如采购部员工信息表、采购项目表等)。

       当第一个select被选择后要到后台查询第二个select要显示的数据,再传给前台显示。这里就用到了ajax和new Option。

 

首先后台:

 

		response.setContentType("text/xml;charset=UTF-8");
		PrintWriter writer = response.getWriter();
		writer.write("<?xml version=\"1.0\" encoding=\"UTF-8\"?>");
		writer.write("<info>");
		writer.write("<id>");
		writer.write(xxx.getXXX());	//查询得到的id属性值
		writer.write("</id>");
		writer.write("<name>");
		writer.write(xxx.getXXX());	//查询得到的name属性值
		writer.write("</name>");
		writer.write("</info>");
		writer.flush();

 

前台:

 

var doc = xmlHttp.responseXML.documentElement;	//xmlHttp对象的初始化就不说了
var gts = doc.getElementsByTagName("info");
							
for(var x=0;x<gts.length;x++) {
								
	var id = gts[x].childNodes[0].firstChild.nodeValue;
	var name = gts[x].childNodes[1].firstChild.nodeValue;
								
	var opt = new Option(name,id);	//<option value="id的值">name的值</option>
								
	if(browser.isFF) select2.options.add(opt);
	else select2.add(opt);
								
							}

 

 

最后点击查询Button时我没有用局部刷新的办法来显示列表数据,而是用了form提交。于是就要传递select2被选择的值到后台,并在页面返回时传回来作为被选择的option的判断,再进行设置。

但是我上网搜几种办法都没完成option被选择的效果

(比如selector.options[x].selected=true,selector.selectedIndex=x)
最后用了opt.selected = true; 才正确

你可能感兴趣的:(option)