js,jquery實現下拉列表按順序顯示選擇項

2021-09-01 12:48:58 字數 1030 閱讀 9805

需求是這樣的,要求在下拉框中選擇一些人員名單,選中的第一人為小組組長,其餘的為小組成員。

實現過程,為select標籤繫結乙個onchange()事件,onchange事件中用value()去拿取select的值而不是用text()拿取文字值,也不是用選擇器「select option:selected」獲取已選擇的項。**如下

廣東省

廣西省福建省

湖南省山東省

js的onchange()**如下

function show()elseelse

name=val;

}// console.info("first的值:"+first)

// console.info("下拉列表陣列的值"+val)

}

因為獲取到的文字值是以陣列形式存在,需要用迴圈遍歷 方式遍歷 查詢小組組長是否還在選項當中,isinarray()**如下,需要 傳入兩個引數,arr是需要傳入的遍歷的陣列,即選中的小組成員名單,value為需要遍歷查詢的元素,即小組組長,返回結果型別為boolean型別。如果存在則返回true,不存在則返回false。

function isinarray(arr,value)

}return false;

}

最後將提取的資訊列印到文字框當中

$('textarea').text("小組組長:" +first+"\n小組成員:"+name);
到此大致內容完成,

不過要注意的是,在小組組長沒在陣列中是,選則的小組組長是當前陣列的第一位,並不是認為選擇的第二位成員。

完整**如下

廣東省廣西省

福建省湖南省

山東省

css實現下拉列表

為什麼要用下拉列表,因為有動態效果而且可看可不看的,我認為使用下拉列表對我們的頁面有美化作用。怎麼實現?首先思路就是使用display屬性來進行控制,這是網頁設計非常重要的屬性之一。關於display屬性,我們應該要知道它具體的屬性值和作用。因為屬性值較多,我列舉常用的幾個屬性 屬性值作用 none...

HTML JS CSS 實現下拉列表

5.7製作的思路是 1.靜態網頁的製作 2.動態特效實現選單的顯示和隱藏 三種方法 css j ascript jquery 3.瀏覽器的相容問題 低版本ie可能不支援等 在用css實現時,由於盒子模型有自己預設的margin和padding值,所以要reset。要在二級選單變化的時候,一級選單不受...

VSTA InfoPath如何實現下拉列表聯動

最近使用infopath開發點東西,想實現兩個下拉列表實現聯動。需求如下 下拉列表field1值為a時,下拉列表field2選項有a1 a2 下拉列表field1值為b時,下拉列表field2選項由b1 b2 下面我們開始設計表單。1 建立兩個下拉列表 field1 field2 2 field1列...