jquery文本框改变事件

jquery文本框改变事件可参考如下几个事件:TEXTBOXEVENT$(document).ready(function(){ //按键弹起时触发事件 $(“#mytext”).keyup(function(){vartxtChange=$(“#mytext”).val(); $(“#p1”).html(“”+txtChange

jquery文本框改变事件"

可参考如下几个事件:

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>TEXTBOX EVENT</title>
  <script src="jquery-ui-1.11.4.custom/external/jquery/jquery.js"></script>
  
<script>
$(document).ready(function(){
	//按键弹起时触发事件
	$("#mytext").keyup(function(){  
        var txtChange = $("#mytext").val();  		
        $("#p1").html("<p>"+txtChange+"</p>");  
    });  
	
	//按键按下时触发事件(先响应事件,再显示输入结果(获得的是上一次结果),可能被输入法拦截)
	$("#mytext2").keypress(function(){  
        var txtChange = $("#mytext2").val();  		
        $("#p2").html("<p>"+txtChange+"</p>");  
    });  
	
	//属性改变时触发事件(不管是获得焦点还是value改变等,目前只在IE下有效)
	$("#mytext3").bind("propertychange",function(){  
        var txtChange = $("#mytext3").val();  		
        $("#p3").html("<p>"+txtChange+"</p>");  
    }); 
	
	//焦点离开时触发事件
	$("#mytext4").change(function(){  
        var txtChange = $("#mytext4").val();  		
        $("#p4").html("<p>"+txtChange+"</p>");  
    });  
	
	//获得焦点时触发事件
	$("#mytext5").focus(function(){  
        var txtChange = $("#mytext5").val();  		
        $("#p5").html("<p>"+txtChange+"</p>");  
    });  
	
})
</script>
  
</head>
<body>
    <input type="text" id="mytext" name="test" class="txt" value="key up "/>  
    <p id="p1"></p>  
	
	<input type="text" id="mytext2" name="test" class="txt" value="key press "/>  
    <p id="p2"></p>  
	
	<input type="text" id="mytext3" name="test" class="txt" value="just useful in IE"/>  
    <p id="p3"></p>  
	
	<input type="text" id="mytext4" name="test" class="txt" value="change"/>  
    <p id="p4"></p>  

	<input type="text" id="mytext5" name="test" class="txt" value="focus"/>  
    <p id="p5"></p>  	
</body>

  <script>  
  

</script> 
</html>

今天的文章jquery文本框改变事件分享到此就结束了,感谢您的阅读,如果确实帮到您,您可以动动手指转发给其他人。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
如需转载请保留出处:https://bianchenghao.cn/33024.html

(0)
编程小号编程小号

相关推荐

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注