求鼠标点击修改表格单元的代码

比如有TB :
<table border="1">
  <tr>
    <td>123</td>
    <td>456</td>
  </tr>
  <tr>
    <td>ABC</td>
    <td>DEF</td>
  </tr>
</table>我想用鼠标点击第二列 也就是 ABC 或EDF 时 可进行修改 并能提交到数据库。
请大家帮忙给代码。本人初学！！

解决方案 »

  1.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
     <head>
      <title> New Document </title>
      <meta name="Generator" content="EditPlus">
      <meta name="Author" content="">
      <meta name="Keywords" content="">
      <meta name="Description" content="">
      <script type="text/javascript">
      <!--
    function chgval(obj){
    var val = obj.innerHTML;
    var cs = obj.children;
    var f = false;
    for(var i = 0;i<cs.length;i++){
    var c = cs[i];
    if(c.tagName == 'INPUT'){
    f = true;
    break;
    }
    }
    if(!f){
    obj.innerHTML = '';
    var input = document.createElement("input");
    input.name = "name";
    input.value = val;
    input.onblur = function(){
    alert('利用ajax去后台保存数据！');
    obj.innerHTML = this.value;
    }
    obj.appendChild(input);
    }

    }
      //-->
      </script>
     </head> <body>
      <table border="1">
      <tr>
        <td>123</td>
        <td>456</td>
      </tr>
      <tr>
        <td onclick="chgval(this)">ABC</td>
        <td onclick="chgval(this)">DEF</td>
      </tr>
    </table> </body>
    </html>
      

  2.   


    <html>
    <head>
    <script type="text/javascript">
    function chgval(obj){
    document.getElementById(obj.id).innerHTML = '<input type="text" value="'+document.getElementById(obj.id).innerText+'" />';
    }
    </script>
    </head>
    <body>
      <table border="1">
      <tr>
       <td>123</td>
       <td>456</td>
      </tr>
      <tr>
       <td id="abc" onclick="chgval(this)">ABC</td>
       <td id="def" onclick="chgval(this)">DEF</td>
      </tr>
    </table>
    </body>
    </html>
    要提交到后台就用Ajax