layui獲取select下拉框選中的option的值

layui獲取select下拉框選中的option的值

使用javascript原生的方法javascript

表單以下

注意須要加上lay-filter="status"java

<form class="layui-form" action="">
	<div class="layui-form-item">
		<label class="layui-form-label">狀態:</label>
			<div class="layui-input-inline" style="width:100px">
				<select id='status' name="status"  layui-verify="required" lay-filter="status" >
                 	<option value='0' <c:if test='${demo.status == 0}'>selected</c:if>>無效</option>
                    <option value='1' <c:if test='${demo.status == 1}'>selected</c:if>>有效</option>
                </select>
			</div>
		</div>
</form>

js取值

<script type="text/javascript">
	layui.use('form', function(){
		var form = layui.form;
		form.on('select(status)', function(){
			//1:拿到select對象: 
			var myselect=document.getElementById("status");
			//2:拿到選中項的索引:
			var index=myselect.selectedIndex ; // selectedIndex表明的是你所選中項的index
			//3:拿到選中項options的value: 
			console.log(myselect.options[index].value);
			//4:拿到選中項options的text: 
			console.log(myselect.options[index].text);
		});
	});
</script>

效果以下

在這裏插入圖片描述

相關文章
相關標籤/搜索