<table id="ccc" class="table_c" width="683" onClick="setPos(this)" style="border-collapse: collapse">
<tr align="center" bgcolor="#5DC0F3">
<td>
</td>
</tr>
<tr>
<td>
<div contentEditable> </div> <!-- contentEditable 可以修改td中内容 -->
</td>
</tr>
</table>
//新增行
function insertRow(obj){
if(currRow >= 0 && currRow<obj.rows.length){
var maxCell=obj.rows[0].cells.length;
obj.insertRow(currRow+1);
for(var i=0;i<maxCell;i++){
obj.rows[currRow+1].insertCell(i);
obj.rows[currRow+1].cells[i].innerHTML="<div contentEditable>"+q[i]+"</div>";
}
clear();
chnBgcolor(obj,currRow,"#5DC0F3");
}
qxs++;
}
//删除行
function deleteRow(obj){
var rows=obj.rows.length;
if(currRow>=1&&currRow<rows){
obj.deleteRow(currRow);
}
clear();
qxs--;
}
//改变选中行的颜色
function chnBgcolor(obj,index,color){
for(var i=0;i<obj.rows.length;i++){
if(i==index){
obj.rows[i].bgColor=color;
obj.rows[0].bgColor="#5DC0F3";
}else{
obj.rows[i].bgColor="#F6FCFF";
}
}
}
//选择行
function setPos(obj){
var o = event.srcElement;
if(o.tagName == "DIV"){
currRow = o.parentElement.parentElement.rowIndex;
currCell=o.parentElement.cellIndex;
chnBgcolor(obj,currRow,"#C8EAFF");
}else if(o.tagName == "TD"){
currRow=o.parentElement.rowIndex;
currCell=o.cellIndex;
}else{
currRow=obj.rows.length-1;
currCeil=obj.rows[0].cells.length-1;
}
}
//清空
function clear(){
currRow=0;
currCell=0;
}
//利用jquery获取table中的td内容
var qx = "";
$("#ccc td div").each(function(){
qx = qx +$(this).html()+"|";
});
分享到:
相关推荐
用于layui table 自定义列,保存table模板
主要介绍了vue element table中自定义一些input的验证操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
用户可以自定义各个表格列的类型(如文本、长度、数字型等),可以自定义各个表格列的输入方式(如文本框、下拉框、日期等)、可以自定义各输入框的校验(如必填项、只读项等),大大减少编程的工作量。
使用customRow 设置行属性,写对应事件 :customRow=”rowClick” 然后在data里面写 rowClick: record => ({ // 事件 on: { click: () => { ...单元格的自定义分为两种方式。 一种是:通过tem
封装HTML的Table,可直接编辑单元格内容,光标失去焦点时更新表格数据,利用slot插槽绑定操作按钮(编辑,删除、分享等),涉及到技术点包括:父组件给子组件传值、refs 对DOM进行操作,slot具名插槽的使用,插槽...
功能强大的javascript表格排序,可以设定排序规则,设定哪些列排序,哪些列不排序。运行速度快。两部操作就搞定,使用方便简单!解决服务器端数据库排序的压力!
NULL 博文链接:https://xiaomaha.iteye.com/blog/1106606
主要介绍了jquery实现自定义树形表格的方法,结合实例形式分析了jQuery创建自定义树形结构table的相关操作技巧,需要的朋友可以参考下
el-table,el-form在vue中封装组件化,含操作按钮和插槽
flink13 操作clickhouse 的代码实现 包括source sink 的代码实现直接mavne clean install 放入到 flink lib 目录下 然后直接运行就可以 用flink sql 往clickhouse 中 的 clickhouse inck source 和 sink sql 直接...
Pro-Table 是阿里Ant Design Pro V4版本,在Table基础上再封装的一个组件,包含完整的增删改查逻辑,不用复杂的操作,简单几个配置即可实现 官网Api地址 https://protable.ant.design/ 示例 V4版本刚出不久,网上的...
XPTable 是一个很好用的数据表格控件,可以高度自定义的ListView控件,允许列复选框、图标、下拉框、数字框、进度条等,并且可以非常容易的进行排序等操作,功能强大、代码严谨。 >完全自定义外观:从列、行到...
BootStrap-table 表格固定列,固定左侧列以及右侧列,可以固定特定的列,fixedColumns: true, fixedNumber: 2,fixedRightNumber:1,值可以自定义,一定要使用配套(压缩包就是配套的相关文件)的内容,否则会出现一些...
ant-design-vue版本:~1.3.8 需求:表格实现跨行合并,并且在合并完的单元格中显示图片 效果图: 源码: export default { data() { ... varTable: { cloumns: [ { title: '置信度', dataIndex:
XPTable 是一个很好用的数据表格控件,可以高度自定义的ListView控件,允许列复选框、图标、下拉框、数字框、进度条等,并且可以非常容易的进行排序等操作,功能强大、代码严谨。 完全自定义外观:从列、行到单元格...
codeFactory 介绍: 1.codeFactory: Java代码生成,依赖rapid-generator.4.0.6...方法传参(table表名),支持批量传参和单表操作 3.main方法运行CodeGenerator类,在配置的outRoot输出路径找到生成代码,复制到对应项目包下.
XPTable 是一个很好用的数据表格控件,可以高度自定义的ListView控件,允许列复选框、图标、下拉框、数字框、进度条等,并且可以非常容易的进行排序等操作,功能强大、代码严谨。比较适合学习交流使用,感兴趣的可以...
ddl语言自定义数据库字段 <!--#include virtual="/public/back_top.asp"--> <html><br><head><br><meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <link href="member/css/common....
通用表对表使用标准标记,即table,tr和td元素等,并支持扩展行,搜索,过滤器,排序,分页,导出为CSV,列单击,自定义列呈现,自定义导出值。 产品特点 使用标准HTML表格(无div等) 标记使用Twitter引导类名称 ...