HTML中select標籤單選多選詳解

2021-09-26 10:13:20 字數 1759 閱讀 4748

select 元素可建立單選或多選選單。當提交表單時,瀏覽器會提交選定的專案,或者收集用逗號分隔的多個選項,將其合成乙個單獨的引數列表,並且在將 表單資料提交給伺服器時包括 name 屬性。

一、基本用法:

volvo

saab

opel

audi

其中,標籤可以省掉,在頁面中用法

"studycenter" id="studycenter"  size="1">

"0">全部

"1">湖北電大網路學習中心

"2">成都師範學院網路學習中心

"3">武漢職業技術學院網路學習中心

二、select元素還可以多選,看如下**:

//有multiple屬性,則可以多選

高中大學

博士//下面沒有multiple屬性 , 只顯示一條,不能多選

高中大學

博士//下面是設定了size屬性的情況 , 如果size = 3 那麼就顯示三條資料,注意不能多選的。

小學初中

高中中專

大專本科

研究生博士

博士後請選擇

三、 多選select元件涉及的所有常用操作:

1.      判斷select選項中是否存在指定值的item 

@param objselectid 將要驗證的目標select元件的id

@param objitemvalue 將要驗證是否存在的值

function isselectitemexit(objselectid,objitemvalue)    else    } }

3.    從select選項中刪除選中的項,支援多選多刪

@param objselectid 將要進行刪除的目標select元件id

function removeselectitemsfromselect(objselectid) else

}   

}  return selectitemsvaluesstr;

}7. 將乙個select中的所有選中的選項移到另乙個select中去

@param fromobjselectid  移動item的原select元件id

@param toobjectselectid  移動item將要進入的目標select元件id

function moveallselectedtoanotherselectobject(fromobjselectid, toobjectselectid) {  

var objselect = document.getelementbyid(fromobjselectid);

var delnum = 0;

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

for(var i=0;i8. 將乙個select中的所有選項移到另乙個select中去

@param fromobjselectid  移動item的原select元件id

@param toobjectselectid  移動item將要進入的目標select元件id

function movealltoanotherselectobject(fromobjselectid, toobjectselectid) {  

var objselect = document.getelementbyid(fromobjselectid);

if (null != objselect) {

for(var i=0;i參考位址

JS對HTML標籤select的操作

空 1 獲得html控制項 var select document.getelementsbyname aaa 0 select.selectedindex index 建立新的option物件 new option text,value new option text,value,defaults...

html中select的詳解

calico tortie siamese bmwporsche mercedes 寶馬 保時捷大奔 附 一些select的技巧 1.動態建立select function createselect 3.刪除所有選項option function removeall 4.刪除乙個選項option f...

HTML中 select 與datalist的異同

比較 異同點select datalist 多選可以 不可以缺失值 可以不可以 查詢不可以 可以增添選項 不可以可以 選擇 name capital multiple value bj 北京option value jn 山東option value zhzh 河南option select for...