在HTML里select标签怎么用

这篇文章主要为大家展示了“在HTML里select标签怎么用”，内容简而易懂，条理清晰，希望能够帮助大家解决疑惑，下面让小编带领大家一起研究并学习一下“在HTML里select标签怎么用”这篇文章吧。

创新互联公司是一家集网站建设,西平企业网站建设,西平品牌网站建设,网站定制,西平网站建设报价,网络营销,网络优化,西平网站推广为一体的创新建站企业，帮助传统企业提升企业形象加强企业竞争力。可充分满足这一群体相比中小企业更为丰富、高端、多元的互联网需求。同时我们时刻保持专业、时尚、前沿，时刻以成就客户成长自我，坚持不断学习、思考、沉淀、净化自己，让我们为更多的企业打造出实用型网站。

一、基本用法：

Volvo

Saab

Opel

Audi

其中，标签可以省掉，在页面中用法

全部

湖北电大网络学习中心

成都师范学院网络学习中心

武汉职业技术学院网络学习中心

二、Select元素还可以多选，看如下代码：

//有multiple属性，则可以多选

高中

大学

博士

//下面没有multiple属性,只显示一条，不能多选

高中

大学

博士

//下面是设置了size属性的情况,如果size=3那么就显示三条数据，注意不能多选的。

小学

初中

高中

中专

大专

本科

研究生

博士

博士后

请选择

1.判断select选项中是否存在指定值的Item

@paramobjSelectId将要验证的目标select组件的id

@paramobjItemValue将要验证是否存在的值

functionisSelectItemExit(objSelectId,objItemValue){

varobjSelect=document.getElementById(objSelectId);

varisExit=false;

if(null!=objSelect&&typeof(objSelect)!="undefined"){

for(vari=0;i

if(objSelect.options[i].value==objItemValue){

isExit=true;

break;

}

}

}

returnisExit;

}

2.向select选项中加入一个Item

@paramobjSelectId将要加入item的目标select组件的id@paramobjItemText将要加入的item显示的内容@paramobjItemValue将要加入的item的值functionaddOneItemToSelect(objSelectId,objItemText,objItemValue){varobjSelect=document.getElementById(objSelectId);if(null!=objSelect&&typeof(objSelect)!="undefined"){//判断是否该值的item已经在select中存在if(isSelectItemExit(objSelectId,objItemValue)){$.messager.alert('提示消息','该值的选项已经存在!','info');}else{varvarItem=newOption(objItemText,objItemValue);objSelect.options.add(varItem);}}}

3.从select选项中删除选中的项，支持多选多删

@paramobjSelectId将要进行删除的目标select组件id

functionremoveSelectItemsFromSelect(objSelectId){

varobjSelect=document.getElementById(objSelectId);

vardelNum=0;

if(null!=objSelect&&typeof(objSelect)!="undefined"){

for(vari=0;i

if(objSelect.options[i].selected){

objSelect.options.remove(i);

delNum=delNum+1;

i=i-1;

}

}

if(delNum<=0){

$.messager.alert('提示消息','请选择你要删除的选项!','info');

}else{

$.messager.alert('提示消息','成功删除了'+delNum+'个选项!','info');

}

}

}

4.从select选项中按指定的值删除一个Item

@paramobjSelectId将要验证的目标select组件的id

@paramobjItemValue将要验证是否存在的值

functionremoveItemFromSelectByItemValue(objSelectId,objItemValue){

varobjSelect=document.getElementById(objSelectId);

if(null!=objSelect&&typeof(objSelect)!="undefined"){

//判断是否存在

if(isSelectItemExit(objSelect,objItemValue)){

for(vari=0;i

if(objSelect.options[i].value==objItemValue){

objSelect.options.remove(i);

break;

}

}

$.messager.alert('提示消息','成功删除!','info');

}else{

$.messager.alert('提示消息','不存在指定值的选项!','info');

}

}

}

5.清空select中的所有选项

@paramobjSelectId将要进行清空的目标select组件id

functionclearSelect(objSelectId){

varobjSelect=document.getElementById(objSelectId);

if(null!=objSelect&&typeof(objSelect)!="undefined"){

for(vari=0;i

objSelect.options.remove(i);

}

}

}

6.获取select中的所有item，并且组装所有的值为一个字符串，值与值之间用逗号隔开

@paramobjSelectId目标select组件id

@returnselect中所有item的值，值与值之间用逗号隔开

functiongetAllItemValuesByString(objSelectId){

varselectItemsValuesStr="";

varobjSelect=document.getElementById(objSelectId);

if(null!=objSelect&&typeof(objSelect)!="undefined"){

varlength=objSelect.options.length

for(vari=0;i

if(0==i){

selectItemsValuesStr=objSelect.options[i].value;

}else{

selectItemsValuesStr=selectItemsValuesStr+","+objSelect.options[i].value;

}

}

}

returnselectItemsValuesStr;

}

以上是“在HTML里select标签怎么用”这篇文章的所有内容，感谢各位的阅读！相信大家都有了一定的了解，希望分享的内容对大家有所帮助，如果还想学习更多知识，欢迎关注创新互联行业资讯频道！

文章名称：在HTML里select标签怎么用
网址分享：http://mswzjz.cn/article/isphes.html