http://vitalets.github.io/x-editable/
可以跟bootstrap或者跟jquery整合,蛮好用的。
如果跟dataTables结合起来用,相当于是extJs了,很不错。 下面是一个结合使用的例子:
<script src="/assets/js/bootstrap-editable.min.js"></script> <link href="/assets/css/bootstrap-editable.css" rel="stylesheet"> ....
<script> //某列的写法 { "data": "firstName", "name": "firstName", "render": function ( data, type, full, meta ) { var template = '<a href="#" class="firstNameEditable editable editable-click" data-type="text" data-pk="{1}" data-name="firstName" data-url="/updateManAjax" data-title="New First Name">{0}</a>'; var html = template.format(full.firstName, full.manId); //作者在这里使用了模板引擎,你自己直接拼字符串也可以 return html ; }, ... }, ... //在dataTable的回调中注册editable组件。你必须写在dataTable的相关回调里面,只有等dataTable渲染完后,前面定义的editable dom结构才能被系统识别,也才能注册为editable组件 "drawCallback": function( settings ) { $(".firstNameEditable").each(function(i,dom){ $(dom).editable({ success:function(response, newValue) { if(response.failed){//是不是failed取决于你的ajax服务的json结构。 return response.error; } }, error:function(response, newValue) { console.log(response); return "网络或服务端错误"; } }); }); }, </script>