简单人生
幻想指点江山，梦中激扬文字
[导入]onDblClick?onDoubleClick?ondblclick?
XML/HTML代码
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
  2. <html>  
  3.  <head>  
  4.   <title> New Document </title>  
  5.   <script language="JavaScript" src="http://jqueryjs.googlecode.com/files/jquery-1.2.6.pack.js"> </script>  
  6.  </head>  
  7.   
  8.  <body>  
  9.   <table>  
  10.   <tr>  
  11.     <td><span class="forupdate" name="price" id="price">1234.56</span></td>  
  12.   </tr>  
  13.   <tr>  
  14.     <td><span class="forupdate" name="number" id="number">55</span></td>  
  15.   </tr>  
  16.   </table>  
  17.   
  18.   <script language="JavaScript">  
  19.   <!--   
  20.     $(document).ready(function(){   
  21.         $('.forupdate').dblclick(function(){   
  22.             var Input = "<input type='text' >";   
  23.             var InputValue = $(this).text();   
  24.             $(this).html( Input );   
  25.             $(this).children('input').attr('name', $(this).attr('name')+'_update')   
  26.                 .attr('id', $(this).attr('id')+'_update')   
  27.                 .val( InputValue );   
  28.             $('#'+$(this).attr('id')+'_update').focus()   
  29.                 .blur( function(){   
  30.                     //这里用ajax如果成功，再返回。否则。。   
  31.                     //....现在不处理。   
  32.                     $ajaxReturn = true;   
  33.                     if( $ajaxReturn == true){   
  34.                         $(this).parent().html( $(this).val() ) ;   
  35.                     }   
  36.                 });   
  37.         });   
  38.     });   
  39.   //-->  
  40.   </script>  
  41.  </body>  
  42. </html>  

可以拷贝到编辑器里，双击数字进行测试……

后记：虽然知道这种控件网上会很多，但是没料到会这么多……

贴一个地址吧，也是jQuery的插件：http://www.appelsiini.net/projects/jeditable，NND啥时候一生气，也搞成插件出来……


文章来源:http://www.neatcn.com\/?action=show&id=105
posted on 2008-05-30 16:37 简单人生 阅读(464) 评论(0)  编辑 收藏 引用
只有注册用户登录后才能发表评论。
 
Powered by:
IT博客
Copyright © 简单人生