layui点击按钮添加可编辑的一行方法


Posted in Javascript onAugust 15, 2018

昨天已经成功添加了一行,今天希望所添加的一行可以进行单元格编辑。

然而,发现添加了edit:'text'以后也不可以进行单元格编辑,而原本已有的数据可以,因此通过浏览器调试看了原有数据的样式,如图所示:

layui点击按钮添加可编辑的一行方法

因此,将点击按钮添加一行<tr>标签的方法,修改为如下:

$("#addTable").click(function(){
var tr=" <tr>"+
   " <td data-field='domainId' data-edit='text'> <div class='layui-table-cell laytable-cell-1-domainId '>11 </div></td>"+
   " <td data-field='colName' data-edit='text'> <div class='layui-table-cell laytable-cell-1-colName '>22 </div></td>"+
   " <td data-field='typeName' data-edit='text'> <div class='layui-table-cell laytable-cell-1-typeName '>33 </div></td>"+
   " <td data-field='scale'  data-edit='text'> <div class='layui-table-cell laytable-cell-1-scale  '>44 </div></td>"+
   " <td data-field='notNull' data-edit='text'> <div class='layui-table-cell laytable-cell-1-notNull '>55 </div></td>"+      
   " </tr>";                                                                 
 $(".layui-table-body .layui-table tbody").append(tr); });

效果如下:

layui点击按钮添加可编辑的一行方法

以上这篇layui点击按钮添加可编辑的一行方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery总体架构的理解分析
Mar 07 Javascript
JS 加入收藏夹的代码(主流浏览器通用)
May 13 Javascript
多个jquery.datatable共存,checkbox全选异常的快速解决方法
Dec 10 Javascript
jquery获取当前点击对象的value方法
Feb 28 Javascript
jquery网页回到顶部效果(图标渐隐,自写)
Jun 16 Javascript
AngularJS+Node.js实现在线聊天室
Aug 28 Javascript
JavaScript判断数字是否为质数的方法汇总
Jun 02 Javascript
js实现无缝循环滚动
Jun 23 Javascript
原生JS下拉加载插件分享
Dec 26 Javascript
vue 解除鼠标的监听事件的方法
Nov 13 Javascript
VUE : vue-cli中去掉路由中的井号#操作
Sep 04 Javascript
在vs code 中如何创建一个自己的 Vue 模板代码
Nov 10 Javascript
layui 优化button按钮和弹出框的方法
Aug 15 #Javascript
jQuery实现参数自定义的文字跑马灯效果
Aug 15 #jQuery
Webpack 4.x搭建react开发环境的方法步骤
Aug 15 #Javascript
React+Webpack快速上手指南(小结)
Aug 15 #Javascript
layui从数据库中获取复选框的值并默认选中方法
Aug 15 #Javascript
关于微信小程序bug记录与解决方法
Aug 15 #Javascript
layui select获取自定义属性方法
Aug 15 #Javascript
You might like
克隆一个新项目的快捷方式
2013/04/10 PHP
Codeigniter检测表单post数据的方法
2015/03/21 PHP
mod_php、FastCGI、PHP-FPM等PHP运行方式对比
2015/07/02 PHP
PHP+MySQL实现无极限分类栏目的方法
2015/12/23 PHP
PHP中phar包的使用教程
2017/06/14 PHP
jquery ready函数源代码研究
2009/12/06 Javascript
javascript计算用户打开网页的停留时间
2014/01/09 Javascript
javascript制作网页图片上实现下雨效果
2015/02/26 Javascript
JavaScript计算两个日期时间段内日期的方法
2015/03/16 Javascript
基于jQuery实现二级下拉菜单效果
2016/02/01 Javascript
BootStrap实现轮播图效果(收藏)
2016/12/30 Javascript
xmlplus组件设计系列之分隔框(DividedBox)(8)
2017/05/02 Javascript
bootstrap daterangepicker双日历时间段选择控件详解
2017/06/15 Javascript
微信小程序对接七牛云存储的方法
2017/07/30 Javascript
浅谈JS获取元素的N种方法及其动静态讨论
2017/08/25 Javascript
[原创]jquery判断元素内容是否为空的方法
2018/05/04 jQuery
vue动态路由配置及路由传参的方式
2018/05/23 Javascript
Vue 路由切换时页面内容没有重新加载的解决方法
2018/09/01 Javascript
基于iview的router常用控制方式
2019/05/30 Javascript
[01:15:12]DOTA2上海特级锦标赛主赛事日 - 1 败者组第一轮#4Newbee VS CDEC
2016/03/03 DOTA
python dict.get()和dict['key']的区别详解
2016/06/30 Python
Python Socket传输文件示例
2017/01/16 Python
美国高端寝具品牌:Coyuchi
2017/02/08 全球购物
澳大利亚女装精品店:Alannah Hill
2020/07/29 全球购物
英文商务邀请信
2014/01/22 职场文书
餐厅经理岗位职责范本
2014/02/17 职场文书
三分钟演讲稿事例
2014/03/03 职场文书
2014年预备党员学习两会心得体会
2014/03/17 职场文书
市级文明单位申报材料
2014/05/07 职场文书
小学语文业务学习材料
2014/06/02 职场文书
班级出游活动计划书
2014/08/15 职场文书
青岛海底世界导游词
2015/02/11 职场文书
2015年收银工作总结范文
2015/04/01 职场文书
2015年大学班级工作总结
2015/04/28 职场文书
《作风建设永远在路上》心得体会
2016/01/21 职场文书
Windows10安装Apache2.4的方法步骤
2022/06/25 Servers