2017-02-28 75 views
0

[HTML]添加創建下拉按鈕,在HTML

「全部」選項現在,我在下拉按鈕三個選項:

<select id='campus' class="form-control"> 
    <option value="Z010">Campus1</option> 
    <option value="Z020">Campus2</option> 
    <option value="Z040" selected>Campus3</option> 
    <option value="?????">- All Campuses-</option> 
</select> 

現在,我想補充的選擇下拉菜單中的「所有校園」,包括所有校園的所有學生,我該怎麼辦?

我不能做以下的,因爲我需要「和」支架,而不是「OR」中:

<option value="{'Z010', 'Z020', 'Z040'}">All</option> 

有什麼建議?

非常感謝!

+1

您如何計劃使用該值?在PHP,JavaScript或其他? – BenM

+0

它是Javascript。謝謝 – Sophie

+0

但您如何計劃使用該值? – BenM

回答

0

這是一種方法,使用JavaScript的<select multiple>和幾行:

var campusOptions = document.getElementsByTagName('option'); 
 
var allCampuses = document.querySelector('[value="all-campuses"]'); 
 

 
function selectAllCampuses() { 
 
    if (allCampuses.selected === true) { 
 
     for (var i = 0; i < (campusOptions.length - 1); i++) { 
 
      campusOptions[i].selected = true; 
 
      allCampuses.selected = false; 
 
     } 
 
    } 
 
} 
 

 
allCampuses.addEventListener('click', selectAllCampuses, false);
<select id="campus" class="form-control" multiple> 
 
    <option value="Z010">Campus1</option> 
 
    <option value="Z020">Campus2</option> 
 
    <option value="Z040" selected>Campus3</option> 
 
    <option value="all-campuses">- All Campuses -</option> 
 
</select>

+0

非常感謝你!你的意思是像在js代碼文件中嵌入js代碼? – Sophie

+0

您可以鏈接到一個外部.js文件,或者 - 最簡單的方法 - 將代碼夾在''之間,然後將所有代碼放在'html'文檔的最後,即'' 。 – Rounin

+1

非常感謝您的回答,這真的很有幫助。我嘗試upvote,但我不到15聲譽.. – Sophie

-2

我想你應該輸入你想要的任何東西,例如「z070」,然後以某種方式在JavaScript讓此選項可添加所有以前的值...