列表框(SELECT) 通用的操作函数 欢迎拍砖

[liudng]

操作包括:
1,搜索;
2,两个列表框之间互相传递;
3,读取列表框选中的值,返回以逗号隔开的字符;
4,清除列表框中所有的选中项;
5,全选或清除全选;

在线演示: 示例
下载JS文件: select.js

比较简单实用,欢迎补充,嘿嘿

[bobor_2008]

支持

[kwh050101]

顶了

[一品梅]

收藏，敬一下豺女...

[xiaojing7]

[Quote=引用 51 楼 only_endure 的回复:]
收藏，敬一下豺女...
[/Quote]

[goldlive_8888]

//全选
function selectAll(sel)
{
for( j=0; j<sel.length; j++ )
{
sel.options[j].selected = true;
}
return true;
}
//取消
function unSelectAll(sel)
{
for( j=0; j<sel.length; j++ )
{
sel.options[j].selected = false;
}
return true;
}
//清空
function empty(sel)
{
for( j=sel.length-1; j>=0; j-- )
{
sel.options[j] = null;
}
return true;
}
//根据value选择
function SelectOneItem( smObject , smValue )
{
for( j=0; j< smObject.length; j++ )
{
smo = smObject.options[j];
if ( smo.value == smValue )
{
smObject.options[j].selected = true;
return ;
}
}
}
//两个select交换
function move( col1, col2)
{
if(col1.selectedIndex==-1) return;
for (var i=0;i<col1.length;i++) {
if (col1.options[i].selected){
toMove = col1.options[i];
opt = new Option( toMove.text, toMove.value, false, false );
col1.options[i] = null;
i=i-1;
var len = col2.length;
col2.options[len] = opt;
}
}
return true;
}
function moveall(col1, col2)
{
while(col1.selectedIndex!=-1)
{
move(col1, col2);
}
}
//添加
function addItem(name,value,col2)
{
opt = new Option( name, value, false, false );
col2.options[col2.length] = opt;
col2.selectedIndex = col2.length-1;
return true;
}
//删除
function remove( col1)
{
col1.options[ col1.selectedIndex ] = null;
return true;
}
//向上移动
function up( col1 )
{
index = col1.selectedIndex;
if( index <= 0 )
return true;

toMoveX = col1.options[ index -1 ];
toMoveY = col1.options[ index ];
optX = new Option( toMoveX.text, toMoveX.value, false, false );
optY = new Option( toMoveY.text, toMoveY.value, false, false );
col1.options[index] = optX;
col1.options[index-1] = optY;
col1.selectedIndex = index-1;
return true;
}
//向下移动
function down( col1 )
{
index = col1.selectedIndex;
if( index+1 >= col1.options.length )
return true;

toMoveX = col1.options[ index ];
toMoveY = col1.options[ index + 1 ];
optX = new Option( toMoveX.text, toMoveX.value, false, false );
optY = new Option( toMoveY.text, toMoveY.value, false, false );
col1.options[index] = optY;
col1.options[index+1] = optX;
col1.selectedIndex = index+1;

return true;
}

[xxladbadboy]

对js没有啥研究，学习一下吧

[ljie520net]

UP

[joegu]

jf

[lingdu_hua]

最好加上拖放,如果能从一个列表拖到另一个列表,这个体验会更好.
如果你说FireFox不支持拖放,我劝你还是改用IE吧...

[lijingziyou]

UP..

[rjzou2006]

sd

[yuanwen813]

分不到我的了

[lfywy]

呵呵

[snlixing]

不错 收藏

[joegu]

顶49楼

<SCRIPT LANGUAGE="JavaScript">
<!--
//全选 
 

    function selectAll(sel) 
    { 
        for( j=0; j <sel.length; j++ ) 
        { 
            sel.options[j].selected = true; 
        } 
        return true; 
    } 
    //取消 
function unSelectAll(sel) 
    { 
        for( j=0; j <sel.length; j++ ) 
        { 
            sel.options[j].selected = false; 
        } 
        return true; 
    } 
    //清空 
    function empty(sel) 
    { 
        for( j=sel.length-1; j>=0; j-- ) 
        { 
            sel.options[j] = null; 
        } 
        return true; 
    } 
    //根据value选择 
    function SelectOneItem( smObject , smValue ) 
{ 
        for( j=0; j < smObject.length; j++ ) 
        { 
            smo = smObject.options[j]; 
            if ( smo.value == smValue ) 
            { 
                smObject.options[j].selected = true; 
                return ; 
            } 
        } 
    } 
    //两个select交换 
    function move( col1, col2) 
    { 
       if(col1.selectedIndex==-1) return; 
     for (var i=0;i <col1.length;i++) { 
            if (col1.options[i].selected){ 
       toMove = col1.options[i]; 
       opt = new Option( toMove.text, toMove.value, false, false ); 
       col1.options[i] = null; 
       i=i-1; 
       var len = col2.length; 
       col2.options[len] = opt; 
    } 
}      
       return true; 
    } 
    function moveall(col1, col2) 
    { 
        while(col1.selectedIndex!=-1) 
        { 
            move(col1, col2); 
        } 
    } 
    //添加 
    function addItem(name,value,col2) 
    { 
       opt = new Option( name, value, false, false ); 
       col2.options[col2.length] = opt; 
       col2.selectedIndex = col2.length-1; 
       return true; 
    } 
    //删除 
    function remove(col1) 
    {
  col1.options[col1.selectedIndex] = null; 
  return true;
    } 
    //向上移动 
    function up( col1 ) 
    { 
      index = col1.selectedIndex; 
      if( index  <= 0 ) 
        return true; 

      toMoveX = col1.options[ index -1 ]; 
      toMoveY = col1.options[ index ]; 
      optX = new Option( toMoveX.text, toMoveX.value, false, false ); 
      optY = new Option( toMoveY.text, toMoveY.value, false, false ); 
      col1.options[index] = optX; 
      col1.options[index-1] = optY; 
      col1.selectedIndex = index-1; 
      return true; 
    } 
    //向下移动 
    function down( col1 ) 
    { 
      index = col1.selectedIndex; 
      if( index+1 >=  col1.options.length ) 
        return true; 

      toMoveX = col1.options[ index ]; 
      toMoveY = col1.options[ index + 1 ]; 
      optX = new Option( toMoveX.text, toMoveX.value, false, false ); 
      optY = new Option( toMoveY.text, toMoveY.value, false, false ); 
      col1.options[index] = optY; 
      col1.options[index+1] = optX; 
      col1.selectedIndex = index+1; 

      return true; 
    } 
//-->
</SCRIPT>

<FORM METHOD=POST ACTION="" name="main">
<SELECT NAME="sel"  Multiple >
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</SELECT>
<SELECT NAME="sel_backup"  Multiple >
<option value="a">a</option>
<option value="b">b</option>
<option value="c">c</option>
</SELECT>
<INPUT TYPE="button" value="全选" onclick="selectAll(document.main.sel);">
<INPUT TYPE="button" value="取消" onclick="unSelectAll(document.main.sel);">
<INPUT TYPE="button" value="清空" onclick="empty(document.main.sel);">
<INPUT TYPE="button" value="根据value选择" onclick="SelectOneItem(document.main.sel,'3');">
<INPUT TYPE="button" value="两个select交换" onclick="move(document.main.sel,document.main.sel_backup);">
<INPUT TYPE="button" value="添加" onclick="addItem(4,'4',document.main.sel);">
<INPUT TYPE="button" value="删除" onclick="remove(document.main.sel);">
<INPUT TYPE="button" value="向上移动" onclick="up(document.main.sel);">
<INPUT TYPE="button" value="向下移动" onclick="down(document.main.sel);">



</FORM>

[fytx0113]

不错，顶顶

[浴火_凤凰]

支持

[浴火_凤凰]

支持

[浴火_凤凰]

不错

[maximus_zhang]

ff 2.0.0.14 下 搜索，全选，清除全选 都出错～～