layui获取select下拉框选中的option的值

时间:2020-8-30 作者:admin


layui获取select下拉框选中的option的值

使用javascript原生的方法

表单如下

注意需要加上lay-filter=”status”

<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>

效果如下

layui获取select下拉框选中的option的值

声明:本文内容由互联网用户自发贡献自行上传,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任。如果您发现有涉嫌版权的内容,欢迎进行举报,并提供相关证据,工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。