js 怎么实现select选中触发事件
1个回答
展开全部
知道么? jquery 有一个叫 change 的函数。。
<html>
<head>
<meta content="charset" charset="UTF-8">
<style type="text/css">
.x{
}
#x li{
float:left;
margin: 10px;
}
.p{
background-color: red;
}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
$('#st').change(function(e){
var opts = $('#x>li');
opts.removeClass('p');
for (var i = 0; i <= opts.length; i++) {
if($(opts[i]).text()==$(this).val()) {
break;
}
$(opts[i]).addClass('p');
};
})
});
</script>
</head>
<body>
<ul id="x">
<li>迈皋桥</li>
<li>红山动物园</li>
<li>南京站</li>
<li>新模范马路</li>
<li>玄武门</li>
<li>鼓楼</li>
<li>珠江路</li>
<li>新街口</li>
<li>张府园</li>
<li>三山街</li>
<li>中华门</li>
<li>安德门</li>
</ul>
<select id="st">
<option>迈皋桥</option>
<option>红山动物园</option>
<option>南京站</option>
<option>新模范马路</option>
<option>玄武门</option>
<option>鼓楼</option>
<option>珠江路</option>
<option>新街口</option>
<option>张府园</option>
<option>三山街</option>
<option>中华门</option>
<option>安德门</option>
</select>
</body>
</html>
<html>
<head>
<meta content="charset" charset="UTF-8">
<style type="text/css">
.x{
}
#x li{
float:left;
margin: 10px;
}
.p{
background-color: red;
}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
$('#st').change(function(e){
var opts = $('#x>li');
opts.removeClass('p');
for (var i = 0; i <= opts.length; i++) {
if($(opts[i]).text()==$(this).val()) {
break;
}
$(opts[i]).addClass('p');
};
})
});
</script>
</head>
<body>
<ul id="x">
<li>迈皋桥</li>
<li>红山动物园</li>
<li>南京站</li>
<li>新模范马路</li>
<li>玄武门</li>
<li>鼓楼</li>
<li>珠江路</li>
<li>新街口</li>
<li>张府园</li>
<li>三山街</li>
<li>中华门</li>
<li>安德门</li>
</ul>
<select id="st">
<option>迈皋桥</option>
<option>红山动物园</option>
<option>南京站</option>
<option>新模范马路</option>
<option>玄武门</option>
<option>鼓楼</option>
<option>珠江路</option>
<option>新街口</option>
<option>张府园</option>
<option>三山街</option>
<option>中华门</option>
<option>安德门</option>
</select>
</body>
</html>
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询