如何使input获取焦点时-变大,失去焦点时变小呢?


摘要:
下文讲述input获取焦点和失去焦点时状态发生变化的实现方法,如下所示:

实现思路:
    1.为input标签绑定onblur 和 onfocus事件
    2.事件中的函数修改其css属性
通过以上两种方法,可达到标题所说效果

例:

<meta charset="utf-8" />
<style>
  .a{  width:20px;}
  .b{ width:100px;}
</style>
<script>
 window.onload = function(){
   var i = document.getElementById("txtTest");
   i.onblur = function(){
	 i.className ="a"; 
   }

   i.onfocus = function(){
	  i.className ="b";
   }  

 } 
</script>
<p>
 maomao365.com <br />
 为input标签获取焦点和失去焦点设置样式
</p>
<hr />
<input type="text" id="txtTest" class="a" />
javascript 使用input大小随焦点变化而变化的示例分享

javascript 使用input大小随焦点变化而变化的示例分享