Javascript operation example for drop-down list box (select)_javascript skills

This article is mainly about the most basic methods related to javascript and select, for reference by people who are not familiar with javascript. A common situation is that the person who proposes the form structure not only needs to design logic for the program and create data structures, but also needs to design the style of the form and be familiar with javascript; some companies may require you to be proficient in photoshop: initially, we all Be an all-rounder.

The following is the basis of our example; this is not a standard form.

Script Home< ;/option>
Baidu

-------------------------------------------------- ----------------------------

Copy codeThe code is as follows:

//全选列表中的项
function SelectAllOption(list)
{
for (var i=0; i{
list.options[i].selected = true;
}
}

//反选列表中的项 by jb51.net asp学习网
function DeSelectOptions(list)
{
for (var i=0; i{
list.options[i].selected = !list.options[i].selected;
}
}

//返回列表中选择项数目
function GetSelectedOptionsCnt(list)
{
var cnt = 0;
var i = 0;
for (i=0; i{
if (list.options[i].selected)
{
cnt++;
}
}

return cnt;
}

//清空列表
function ClearList(list)
{
while (list.options.length > 0)
{
list.options[0] = null;
}
}

//删除列表选中项
//返回删除项的数量
function DelSelectedOptions(list)
{
var i = 0;
var deletedCnt = 0;
while (i {
if (list.options[i].selected)
{
list.options[i] = null;
deletedCnt++;
}
else
{
i++;
}
}

return deletedCnt;
}
//此函数查找相应的项是否存在
//repeatCheck是否进行重复性检查
//若为"v"，按值进行重复值检查
//若为"t"，按文字进行重复值检查
//若为"vt"，按值和文字进行重复值检查
//其它值，不进行重复性检查，返回false
function OptionExists(list, optText, optValue, repeatCheck)
{
var i = 0;
var find = false;

if (repeatCheck == "v")
{
//按值进行重复值检查
for (i=0; i{
if (list.options[i].value == optValue)
{
find = true;
break;
}
}
}
else if (repeatCheck == "t")
{
//按文字进行重复检查
for (i=0; i{
if (list.options[i].text == optText)
{
find = true;
break;
}
}
}
else if (repeatCheck == "vt")
{
//按值和文字进行重复检查
for (i=0; i{
if ((list.options[i].value == optValue) && (list.options[i].text == optText))
{
find = true;
break;
}
}
}

return find;
}

//向列表中追加一个项
//list 是要追加的列表
//optText 和 optValue 分别表示项的文字和值
//repeatCheck 是否进行重复性检查，参见 OptionExists
//添加成功返回 true，失败返回 false
function AppendOption(list, optText, optValue, repeatCheck)
{
if (!OptionExists(list, optText, optValue, repeatCheck))
{
list.options[list.options.length] = new Option(optText, optValue);
return true;
}
else
{
return false;
}
}

//插入项
//index 插入位置，当插入位置 >= 列表现有项数量时，其作用相当于不进行重复检查的追加项
//optText 和 optValue 分别表示项的文字和值
function InsertOption(list, index, optText, optValue)
{
var i = 0;
for (i=list.options.length; i>index; i--)
{
list.options[i] = new Option(list.options[i-1].text, list.options[i-1].value);
}

list.options[index] = new Option(optText, optValue);
}
//Export items in one list to another list
//RepeatCheck whether to perform repeatability checks , see OptionExists
//After the deleteSource item is imported to the target, whether to delete the item in the source list
//Return the number of affected items
function ListToList(sList, dList, repeatCheck, deleteSource)
{
//The number of lines affected
var lines = 0;
var i = 0;
while (i{
if (sList. options[i].selected && AppendOption(dList, sList.options[i].text, sList.options[i].value, repeatCheck))
{
//Added successfully
lines;
if (deleteSource)
{
//Delete items in the source list
sList.options[i] = null;
}
else
{
i;
}
}
else
{
i ;
}
}

return lines;
}

//Move the selected item up in the list
function MoveSelectedOptionsUp(list)
{
var i = 0;
var value = "";
var text = " ";
for (i=0; i{
if (!list.options[i].selected && list.options[i 1 ].selected)
{
value = list.options[i].value;
text = list.options[i].text;
list.options[i] = new Option(list .options[i 1].text, list.options[i 1].value);
list.options[i].selected = true;
list.options[i 1] = new Option(text, value);
}
}
}

//Move the selected item down in the list
function MoveSelectedOptionsDown(list)
{
var i = 0;
var value = "";
var text = " ";
for (i=list.options.length-1; i>0; i--)
{

//www.jb51.net
if (!list.options[i].selected && list.options[i-1].selected)
{
value = list.options[i ].value;
text = list.options[i].text;
list.options[i] = new Option(list.options[i-1].text, list.options[i-1] .value);
list.options[i].selected = true;
list.options[i-1] = new Option(text, value);
}
}
}