当前位置: 代码迷 >> Web前端 >> java中上拉框的相关用法/
  详细解决方案

java中上拉框的相关用法/

热度:273   发布时间:2012-11-09 10:18:47.0
java中下拉框的相关用法/

在java中,常用的下拉框信息的移动,例如:多选框信息移动到多选框,多选框信息移动到单选框等。

?

1.多选框信息移动到多选框(一个名字为kexuan可选下拉框,一个名字为yixuan的下拉框):

?

<select size="20" name="kexuan" multiple style="width:165; height:120" />
?????<option>----可选----</option>

?</select>

?

<select size="20" name="yixuan" multiple style="width:165; height:120" />
?????<option>----已选----</option>

?</select>

?

两个按钮,一个名称addbt的按钮,是将可选信息添加到已选信息的按钮。另一个名字为delbt的按钮,是将已选信息,重新移回到可选中:

?

<input type="button" name="addbt" value="添加"/>

<input type="button" name="delbt" value="删除"/>

?

选中你需添加的可选信息,点击添加按钮即可。

<input type="button" name="addbt" value="添加" onclick="addSlt(form的名称,'kexuan','yixuan');"/>

在已选总,选中需删除的信息,点击删除按钮即可,已选信息将会重新回到可选中。

<input type="button" name="delbt" value="删除" onclick="addSlt(form的名称,'yixuan','kexuan');"/>

(注:添加和删除可调用同一个方法,只是传入的对象不同。)

显示的js代码如下:

?

function addSlt(frmname,keslt,yislt){

? var ks = windows.document.forms[frmname].elements[keslt];

? var ys = windows.document.forms[frmname].elements[yislt];

??var m=0;

? var n=1;

? var arrT=new Array(ks.length);?

? var arrV=new Array(ks.length);

? for(var i=0;i<ks.length;i++){

????? if(ks.options[i].selected=true){

?????????? m=0;

?????????? for(var j=0;j<ys.length;j++){

?????????????? if(ks.options[i].value==ys.options[j].value){

?????????????????? m++;

?????????????????? break;

?????????????? }

?????????? }

?????????? if(m==0){

?????????????? ys.length++;

?????????????? ys.options[ys.length-1].value=ks.options[i].value;

???????????????ys.options[ys.legnth-1].text=ks.options[i].text;

?????????? }

????? }else{

??????????arrT[j]=ks.options[i].text;

????????? arrv[j]=ks.options[i].value;

????????? n++;

???? }

? }

? if(n!=ks.length){

???? ks.length=1;

???? for(var i=0;i<n;i++){

??????? ks.options[i].value=arrV[i];

????????ks.options[i].text=arrT[i];

???? }

? }

}

?

2.多选框的信息添加到单选框。将可选的要素选中,添加到单选框中:

<select name="danxuan">

?? <option>--单选--</option>

</select>

?

<input type="button" name="dxaddbt" value="添加到单选" onclick="dxaddSlt(frmname,'kexuan','danxuan');"/>

?

js方法,如下:

function dxaddSlt(frmname,kxslt,dxslt){

?? var kx = windows.document.forms[frmname].elements[kxslt];

?? var dx = windows.document.forms[frmname].elements[dxslt];

?

?? var t=0;

?? for(var i=0;i<kx.length;i++){

??????? if(kx.options[i].selected==true){

??????????????t=0;

????????????? for(var j=0;j<dx.length;j++){

??????????????????? if(kx.options[i].value==dx.options[j].value){

??????????????????????? t++;

???????????????????????? break;

??????????????????? }

?????????????? }

??????????????? if(t==0){

??????????????????? dx.length++;

????????????????????dx.options[dx.length-1].value=kx.options[i].value;

??????????????????? dx.options[dx.length-1].text=kx.options[i].value;

??????????????? }

??????? }

?? }

??

}

这个方法与第一个方法大同小异。

?

3.若在第一个多选框到多选框中,删除的时候,同时删除单选框中存在的值。方法如下:

function deldx(frmname,yxslt,dxslt){

?? var yx=windows.document.forms[frmname].elements[yxslt];

?? var dx=windows.document.forms[frmname].elements[dxslt];

?? for(var i=0;i<yx.length;i++){

?????? for(var j=0;j<dx.length;j++){

??????????? if(yx.options[i].selected==true){

?????????????????if(yx.options[i].value==dx.options[j].value){

????????????????????? dx.options[j].removeNode(true);

?????????????????}

????????????}

?????? }

??? }

}

?

以上方法仅供参考。