jquery可编辑的表单

<script src= "jquery-1.8.3.min.js" type= "text/javascript"></script>
<script type= "text/javascript">
$( function(){
$( "table tr:even").addClass( "red");
$( "table tr td").dblclick( function(){
     var intval=$( this).html();
    $( this).html( "<input id='edit' value="+intval+ ">");
    $( "#edit").focus().live( "blur", function(){
    
       var editval=$( this).val();
      $( this).parents( "td").html(editval);
    })
  });
})
</script>
<style>
.red{color:red;}
table td{border:1px solid black;}
table {border:1px solid black;}
</style>
<table>
  <tr id= "1">
    <td id= "title">PHPCHINA</td>
    <td id= "time">2012</td>
    <td id= "name">CRAB</td>
  </tr>
  <tr id= "2">
    <td id= "title">PHPCHINA</td>
    <td id= "time">2012</td>
    <td id= "name">CRAB</td>
  </tr>
  <tr id= "3">
    <td id= "title">PHPCHINA</td>
    <td id= "time">2012</td>
    <td id= "name">CRAB</td>
  </tr>
  <tr id= "4">
    <td id= "title">PHPCHINA</td>
    <td id= "time">2012</td>
    <td id= "name">CRAB</td>
  </tr>
</table>

你可能感兴趣的:(JavaScript,jquery)