表格双击可编辑方法

表格双击可编辑方法

方法步骤

1. HTML代码

   <table border="1" width="200" id="table">  
	<tr><td>111</td></tr>  
	<tr><td>222</td></tr>  
	<tr><td>333</td></tr>  
	<tr><td>444</td></tr>  
	<tr><td>555</td></tr>  
    </table> 

2. 引入jquery.js

<script src="./jquery.min.js"></script>

3. JavaScript代码

    $("#table").find("td").bind("dblclick",function(){  
  	 var input ="<input type='text' id='temp' value="+$(this).text()+" >";  
  	 $(this).text("");  
  	 $(this).append(input);  
  	 $("input#temp").focus();  
  	 $("input").blur(function(){  
  	      if($(this).val()==""){  
  			  $(this).remove();  
  		  }else{  
  			  $(this).closest("td").text($(this).val());  
  		  }  
  	  });  
    })

--over--