zoukankan      html  css  js  c++  java
  • jQuery:delegate中select()不起作用的解决方法

    jQuery有一个很好用的delegate(事件委派)功能,可以给当前以及将来(动态添加)的元素绑定一个事件处理函数。

    比如下面的例子,动态添加一个输入文本框后,我想让所有文本框(不管是不是动态添加的)在获取焦点时,自动转大写。

    <!doctype html>
    <html>
    <head>
        <title>delegate测试</title>
    	<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.js"></script>
    	<style type="text/css">
    		*{padding:0;margin:0;list-style:none;margin:5px}	
    	</style>
    
    	<script type="text/javascript">
    		//动态添加一行文本输入框
    		function addInput(){			
    			$("#ulTarget").append("<li><input type=\"text\" value=\"aaaaaa\"/></li>");			
    		}
    
    		
    		$().ready(function(){				
    			$("#ulTarget").delegate(":text","focus",function(){
    				$(this).val($(this).val().toUpperCase());
    			});			
    		})		
    	</script>
    </head>
    <body>
      <ul id="ulTarget">
    	<li><input type="text" value="123456abc"/></li>
    	<li><input type="text" value="123456abc"/></li>
    	<li><input type="text" value="123456abc"/></li>
    	<li><input type="text" value="123456abc"/></li>
      </ul>   
      <button id="btnAdd" onclick="addInput()">add input</button> 
    </body>
    </html>
    

     接下来,我还想加点小功能,在获取焦点时,还要让文本框自动全选。

    		$().ready(function(){				
    			$("#ulTarget").delegate(":text","focus",function(){
    				$(this).val($(this).val().toUpperCase()).select();
    			});			
    		})	
    

     但是实际测下来,.select()死活就是不起作用,无奈请出setTimeout

    		$().ready(function(){				
    			$("#ulTarget").delegate(":text","focus",function(){
    				var jqObj = $(this);
    				jqObj.val(jqObj.val().toUpperCase());
    				setTimeout(function(){jqObj.select();},100);
    			});			
    		})	
    

     解决了.

  • 相关阅读:
    启动 Eclipse 弹出“Failed to load the JNI shared library jvm.dll”错误的解决方法!
    处理textarea的空格和换行
    微信内置页实现自动拨号到页面的功能
    兼容ie的渐变css
    H5压缩图片上传(FileReader +canvas)
    css样式写一个小三角
    js禁止选中图片和文字
    js解决浏览器打印自动分页的问题
    IE8透明度问题
    在css加载完毕后自动判断页面是否加入css或js文件
  • 原文地址:https://www.cnblogs.com/yjmyzz/p/2584137.html
Copyright © 2011-2022 走看看