动态创建的表格单元格中的事件实现代码

代码如下
var tableElem = document.getElementById("MyTable");
var tbodyElem = tableElem.getElementsByTagName("tbody")[0];
var trElem = document.createElement("tr");
var td1 = document.createElement("td");
td1.onclick = "EditCell()";

td1.width = "45%";
td1.innerText = " ";
trElem.appendChild(td1);
tbodyElem.appendChild(trElem);
alert(tbodyElem.innerHTML);

这段代码动态创建一个tr和td，并在td中设置了一个onclick事件，但是事实却是当点击td时，并没有出发点击时间调用EditCell函数。后来吧td1.onclick = "EditCell()";改成td1.attachEvent("onclick",EditCell)才成功调用

赞 (0)

相关推荐

  • 动态创建的表格单元格中的事件实现代码

    代码如下 var tableElem = document.getElementById("MyTable"); var tbodyElem = tableElem.getElementsByTagName("tbody")[0]; var trElem = document.createElement("tr"); var td1 = document.createElement("td"); td1.onclick = &

  • jQuery实现合并表格单元格中相同行操作示例

    jQuery实现合并表格单元格中相同行操作示例

    本文实例讲述了jQuery实现合并表格单元格中相同行操作.分享给大家供大家参考,具体如下: 合并的方法 $("#tableid").mergeCell({ cols:[X,X] ///参数为要合并的列 }) /** * 操作表格 合并单元格 行 * 2016年12月13日16:00:41 */ (function($) { // 看过jquery源码就可以发现$.fn就是$.prototype, 只是为了兼容早期版本的插件 // 才保留了jQuery.prototype这个形式 $.f

  • js生成动态表格并为每个单元格添加单击事件的方法

    html: 复制代码 代码如下: <html> <head> <title>Demo</title> </head> <body> <label style="font-size:20px;width:600px;" >动态表格:</label><br/> <table border="1"> <tbody id="table&qu

  • JavaScript动态改变表格单元格内容的方法

    本文实例讲述了JavaScript动态改变表格单元格内容的方法.分享给大家供大家参考.具体如下: JavaScript动态改变表格单元格的内容,下面的代码通过修改单元格的innerHTML来修改单元格内容 <!DOCTYPE html> <html> <head> <script> function changeContent() { var x=document.getElementById('myTable').rows[0].cells; x[0].i

  • 教你如何使用VUE组件创建SpreadJS自定义单元格

    教你如何使用VUE组件创建SpreadJS自定义单元格

    SpreadJS纯前端表格控件是基于HTML5的Java电子表格和网格功能控件,适用于.NET.Java和移动端等各平台在线编辑类Excel功能的表格程序开发. 本文介绍了如何使用VUE组件创建SpreadJS自定义单元格功能. 作为近五年都冲在热门框架排行榜首的Vue,大家一定会学到的一部分就是组件的使用.前端开发的模块化,可以让代码逻辑更加简单清晰,项目的扩展性大大加强.对于Vue而言,模块化的体现集中在组件之上,以组件为单位实现模块化. 通常我们使用组件的方式是,在实例化Vue对象之前,通

  • JavaScript如何动态创建table表格

    JavaScript如何动态创建table表格

    两种JavaScript动态创建table表格的方法,分享给大家,具体实现如下 方法一:最原始的方法,创建一一元素 var a1=document.createElement("table"); var a2=document.createElement("tbody"); var a3=document.createElement("tr"); var a4=document.createElement("td"); //开

  • VUE+elementui组件在table-cell单元格中绘制微型echarts图

    需求效果图示例 实际完成效果图 ** 代码实现 注:table表格为二次封装的子组件 -在table表格中 根据 scope.$index动态设置元素的id ,便于指定单元格的echarts初始化: -在单元格中触发一个方法,传入当前的scope.row数据或者指定其他数据,并且传入 scope.$index 以及一个字符串便于识别当前是哪条数据的charts -在方法中绘制echarts** <el-table-column align="center"> <tem

  • Java 在Excel单元格中应用一种/多种字体样式(实例代码)

    在Excel表格中,设置单元格字体样式时,可以对单元格内的所有字符应用同一样式,即获取指定单元,应用样式即可:另外也可以对单元格内的不同字符内容应用不同字体样式,即获取单元格中的字符位置,应用样式:本文将通过Java代码示例介绍具体实现方法. 使用工具:Free Spire.XLS for Java (免费版) 注:可通过官网下载包,解压,并将lib文件夹中的Spire.Xls.jar文件导入Java程序:或通过maven仓库导入.导入效果如下: Java代码示例 import com.spir

  • vxe-table如何在单元格中渲染简单的饼图

    vxe-table如何在单元格中渲染简单的饼图

    目录 vxe-table在单元格中渲染饼图 安装插件 基本参数 解决vxe-table的表头动态渲染第一次不显示 问题描述 解决方法 vxe-table在单元格中渲染饼图 有时候遇到比较特殊的需求,比如在很小的单元格中要放个饼图,如果使用 echart 等图表插件又显得太笨重了,毕竟单元格大小有限,vxe-table 官方也提供了一个非常流畅简单图表渲染,仅用于单元格 具体如下: 安装插件 npm install vxe-table-plugin-renderer ```javascript i

  • jQuery实现HTML表格单元格的合并功能

    jQuery实现HTML表格单元格的合并功能

    本文实例讲述了jQuery实现HTML表格单元格合并的方法.分享给大家供大家参考,具体如下: 运行效果截图如下: 合并前: 合并后: 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.

随机推荐