您的位置:首页 > Web前端 > JQuery

Jquery下拉框取值

2016-05-11 17:59 507 查看
<!DOCTYPE html>
<html>
<head>
<title>Bootstrap 实例 - 选择框</title>
<link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
<script>
$(function() {
$("select").change(function(event) {
////获取当前选择的下一项的值
//var obj = $(this).find("option:selected").next();
//alert("选中项的下一个: 内容"+obj.html()+",值"+obj.val());

//获取当前选择的下一项的值
var obj = $(this).find("option:selected");
alert("选中项的: 内容"+obj.html()+",值"+obj.val());
});

})
</script>

<style>
select{width:200px;height:500px;padding:10px;border:4px dashed #ccc;}
select option{margin:5px;}
input[type='button']{width:200px;height:35px;margin:10px;border:2px dashed #ebbcbe;}
</style>
</head>
<body>

<form role="form">

<select id="multi-sel" multiple="multiple">
<option value="1">萝卜,我的value是1</option>
<option value="2">青菜,我的value是2</option>
<option value="3">小葱,我的value是3</option>
<option value="4">豆腐,我的value是4</option>
</select>

</form>

</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: