XML/HTML代码
- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
- <html>
- <head>
- <title> New Document </title>
- <script language="JavaScript" src="http://jqueryjs.googlecode.com/files/jquery-1.2.6.pack.js"> </script>
- </head>
- <body>
- <table>
- <tr>
- <td><span class="forupdate" name="price" id="price">1234.56</span></td>
- </tr>
- <tr>
- <td><span class="forupdate" name="number" id="number">55</span></td>
- </tr>
- </table>
- <script language="JavaScript">
- <!--
- $(document).ready(function(){
- $('.forupdate').dblclick(function(){
- var Input = "<input type='text' >";
- var InputValue = $(this).text();
- $(this).html( Input );
- $(this).children('input').attr('name', $(this).attr('name')+'_update')
- .attr('id', $(this).attr('id')+'_update')
- .val( InputValue );
- $('#'+$(this).attr('id')+'_update').focus()
- .blur( function(){
- //这里用ajax如果成功，再返回。否则。。
- //....现在不处理。
- $ajaxReturn = true;
- if( $ajaxReturn == true){
- $(this).parent().html( $(this).val() ) ;
- }
- });
- });
- });
- //-->
- </script>
- </body>
- </html>
可以拷贝到编辑器里，双击数字进行测试……
后记：虽然知道这种控件网上会很多，但是没料到会这么多……
贴一个地址吧，也是jQuery的插件：http://www.appelsiini.net/projects/jeditable，NND啥时候一生气，也搞成插件出来……