基于jq可编辑表格内容实现代码

table{width:96%; margin:20px auto; border-collapse:collapse;}
table td{line-height:26px; padding:2px; padding-left:8px; border:1px solid #b6d6e6;}
.table_title{height:26px; line-height:26px; background:url(btn_bg.gif) repeat-x bottom; font-weight:bold; text-indent:.3em; outline:0;}
.table_label{background:#e8f5fe; text-align:right; }

$(function(){
     $('.edit').editable('save.php', { 
         width     :120,
         height    :18,
         //onblur    : 'ignore',
         cancel    : '取消',
         submit    : '确定',
         indicator : '',
         tooltip   : '单击可以编辑...'
     });
});

$('.edit_select').editable('save.php', { 
    loadurl   : 'json.php',
    type      : "select",
});

$array['老客户'] =  '老客户';
$array['独自开发'] =  '独自开发';
$array['合作伙伴'] =  '合作伙伴';
$array['公共关系'] =  '公共关系';
$array['展览会'] =  '展览会';
print json_encode($array);

$.editable.addInputType('datepicker', {
    element : function(settings, original) {
        var input = $('');
        input.attr("readonly","readonly");
        $(this).append(input);
        return(input);
    },
    plugin : function(settings, original) {
        var form = this;
        $("input",this).datepicker();
    }
});

$(".datepicker").editable('save.php', { 
    width     : 120,
    type      : 'datepicker',
    onblur    : "ignore",
});

include_once("connect.php"); //连接数据库
$field=$_POST['id'];  //获取前端提交的字段名
$val=$_POST['value']; //获取前端提交的字段对应的内容
$val = htmlspecialchars($val, ENT_QUOTES); //过滤处理内容
 
$time=date("Y-m-d H:i:s"); //获取系统当前时间
if(empty($val)){
    echo "不能为空";
}else{
    //更新字段信息
    $query=mysql_query("update customer set $field='$val',modifiedtime='$time' where id=1");
    if($query){
       echo $val;
    }else{
       echo "数据出错";    
    }
}