在文本框里输入内容到添加到下拉列表里，移除下拉里的内容
 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>



												


											
jquery做一些小的特效的更多相关文章
	

    
								
  1. jquery做一个小的轮播插件---有BUG，后续修改
		
    //首页无缝轮播 ; (function($, window, document, undefined) { $.fn.slider = function(options) { var default ...
    
		
    2. 
						
  2. JQuery仿购物网站放大镜特效所遇问题及思考
		
    JQuery仿购物网站放大镜特效所遇问题及思考 先贴下效果图,然后描述起来也就不会不知道我在说什么了. 我碰到的问题一: 一开始我自己总结了是因为两个小原因导致的①使用了mouseover,mouse ...
    
		
    3. 
						
  3. jquery叠加页片自动切换特效
		
    查看效果:http://keleyi.com/keleyi/phtml/jqtexiao/34.htm 下面是HTML代码: <!DOCTYPE html> <html xmlns= ...
    
		
    4. 
						
  4. 一款仿PBA官网首页jQuery焦点图的切换特效
		
    一款仿PBA官网首页jQuery焦点图的切换特效,非常的简单大方, 在对浏览器兼容性的方面做了不少的功夫.IE6也勉强能过去. 还是一款全屏的焦点图切换特效.大气而清新.很适合简介大方的网站. 下图还 ...
    
		
    5. 
						
  5. 一款非常炫酷的jQuery动态随机背景滚动特效
		
    一款非常炫酷的jQuery动态随机背景滚动特效 图片背景会不停息的滚动,带有那种漂浮的视觉效果,小圈圈飘动. 更好的是还兼容IE6浏览器,大伙可以好好研究研究. 适用浏览器:IE6.IE7.IE8.3 ...
    
		
    6. 
						
  6. jquery实现多条件筛选特效代码分享
		
    本文实例讲述了jquery实现多条件筛选特效.分享给大家供大家参考.具体如下:jquery实现的多条件搜索表单带日期选择表格表单效果源码,是一段实现了多个条件筛选搜索的特效代码,多条件拥有时间.地点. ...
    
		
    7. 
						
  7. jquery环形3D立体旋转特效
		
      jquery环形3D立体旋转特效 作者/代码整理:站长素材  (转载请附加本文地址,带有“懒人原生”字样的谢绝转载)发布日期:2013-07-20   立体效果比较强的jquery特效,周围小图组 ...
    
		
    8. 
						
  8. 一款jquery实现的整屏切换特效
		
    今天要为大家带来一款由jquery实现的整屏切换特效,在右侧有圆型小标,每点一个切换一屏.当然,你也可以滚动鼠标来切换页面.效果非常好.我们看下效果吧 在线预览   源码下载 html代码: < ...
    
		
    9. 
						
  9. jquery-1  jquery几个小实例
		
    jquery-1  jquery几个小实例 一.总结 一句话总结:jquery真的是简单加简便. 1.jquery中改变多个css属性怎么整? 可以链式连接方式,也可以大括号整多个.中间是键值对加引号 ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. 限制input只能输入金额（类似：100.00|100.9|100）
			
    $(".inputmoney").keyup(function () {    var reg = $(this).val().match(/\d+\.?\d{0,2}/);    ...
    
			
    2. 
						
  2. Java EE之一个表单两个按钮响应不同界面（登录与注册）
			
    1.在前端,使用javaScript实现: <script> function logup(){ var element = document.getElementById('login- ...
    
			
    3. 
						
  3. twitter.common.concurrent deadline and defer
			
    此defer非golang中的defer https://tour.golang.org/flowcontrol/12 from twitter.common.concurrent import Ti ...
    
			
    4. 
						
  4. 添加ssh key
			
    我现在根据<github入门和实践>来去摸索github 其实,我发现自己在看github时,感觉不适应,是因为自己太久没有碰到英文了.可以联想到以前当看到一个网页,根据汉字的标题或描述, ...
    
			
    5. 
						
  5. DOS命令详解
			
    DOS命令详解 命令 \? 可以进入命令帮助 1.md命令创建目录. MKDIR [drive:]pathMD [drive:]path 如果命令扩展被启用,MKDIR 会如下改变: 如果需要,MKD ...
    
			
    6. 
						
  6. 关于scale和zoom的区别
			
    其实关于scale,我之前是用他来搞一些css3的特效的放大缩小啊,玩的也挺6666,而*zoom:1之前是用来做css的hack,也就是触发IE6/7的haslayout清除浮动的.终于某天,好事的 ...
    
			
    7. 
						
  7. iOS推送原理
			
    1.首先app会和apns建立长连接,会发送 udid和 bundle id给apns 2.apns会返回给app一个device token 3.用会把device token 发给自己的服务器 4 ...
    
			
    8. 
						
  8. ceil 模块
			
    # 有时需要得到一个最小的整数,而这个数只能比自己大或相等,不能小于自己 #如: 2.1 我们需要得到的最小整数为3,即使后一位只有很小的一部分,一般用于分页 from math import cei ...
    
			
    9. 
						
  9. android studio安卓项目出现Error: Default Activity Not Found错误无法编译的解决方案
			
    项目明明是没有问题的,有时候突然就出现Error: Default Activity Not Found错误,以前出现过我重新安装了android studio 都没有用,后来在网上(http://s ...
    
			
    10. 
						
  10. centos7 apache提供文件下载
			
    1 apache安装 # yum -yinstall httpd //安装httpd会自动安装以下的依赖包: apr apr-util httpd-tools mailcap # rpm -qi ht ...
    
			
    11.