1、在平常所用的控件中下拉框是必不可少的,那麼就有這麼一個小問題,就是怎麼讓它在沒選之前顯示一句提示語哩?實際有好多人知道這個提示語的標籤怎麼寫,不就一個option麼?實際真正想要的效果不是那樣的。
1️⃣ 可能你寫的是這樣的:
<div class="col-xs-12 col-sm-6 col-md-4">
<label class="label-item single-overflow pull-left" title="項目類別:">項目類別:</label>
<form:select path="itemType" class="form-control required">
<option value="" label="">-請選擇-</option>
<c:forEach items="${list}" var="typeList">
<form:option value="${typeList.id}">${typeList.name}</form:option>
</c: forEach>
</form:select>
</div>
效果圖:
結論:可以從圖中看出,你寫的這種很明顯的在點下拉的時候也在下面顯示出來的,這樣的效果不是太好。
2️⃣ 你真正想要的效果
實際就是希望它能夠提示,然後當點擊下拉時,並不讓提示話語也在下面內容中顯示
代碼部分:
<div class="col-xs-12 col-sm-6 col-md-4">
<label class="label-item single-overflow pull-left" title="項目類別:">項目類別:</label>
<form:select path="itemType" class="form-control required">
<option value="" disabled selected hidden>請選擇項目類別</option>
<c:forEach items="${list}" var="typeList">
<form:option value="${typeList.id}">${typeList.name}</form:option>
</c:forEach>
</form:select>
</div>
效果圖:
結論:可以看出就是這種效果,可以作爲提示話語,當點下拉時,它並不會被選中,個人感覺挺好的