在文本框里输入内容到添加到下拉列表里，移除下拉里的内容
1 <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>下拉列表</title>
<script src="jquery-1.11.2.min.js"></script>
</head>
<body>
<select id="sel">
<!--文本框-->
</select>
<input type="text" id="shuru" />
<input type="button" value="添加" id="btn" />
<input type="button" value="移除" id="yichu" />
</body>
<script type="text/javascript">
$("#btn").click(function(){
var v = $("#shuru").val();
var str = "<option value='"+v+"'>"+v+"</option>";
$("#sel").append(str);//append追加意思
}) $("#yichu").click(function(){
var v = $("#shuru").val(); $("[value='"+v+"']").remove(); //移除
})
</script>
</html>
开关灯效果，遮罩层
1 <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>下拉列表</title>
<script src="jquery-1.11.2.min.js"></script>
<style type="text/css">
#zz{width:100%; height:100%; position:absolute; left:0px; top:0px; background-color:black; z-index:5;filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity: 0.5;
opacity: 0.5;}
</style> </head>
<body>
<div id="shang" style="position:absolute; z-index:10; left:100px; top:100px;">
<input type="button" value="关灯" id="guan" />
<input type="button" value="开灯" id="kai" />
</div>
</body> <script type="text/javascript">
$("#guan").click(function(){
var str = "<div id='zz'></div>";
$("body").append(str);
$(this).css("display","none");
$("#kai").css("display","block");
})
$("#kai").click(function(){
$("#zz").remove();
$("#guan").css("display","block");
$(this).css("display","none");
}) </script>
</html>
