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 相关文章推荐
IE/FireFox具备兼容性的拖动代码
Aug 13 Javascript
Javascript与flash交互通信基础教程
Aug 07 Javascript
JS 自动完成 AutoComplete(Ajax 查询)
Jul 07 Javascript
详解jquery事件delegate()的使用方法
Jan 25 Javascript
JS短信验证码倒计时功能的实现(没有验证码,只有倒计时)
Oct 27 Javascript
js中开关变量使用实例
Feb 24 Javascript
Vue2.x中的父组件传递数据至子组件的方法
May 01 Javascript
移动web开发之touch事件实例详解
Jan 17 Javascript
浅析vue.js数组的变异方法
Jun 30 Javascript
Vue实现商品飞入购物车效果(电商项目)
Nov 26 Javascript
Element Rate 评分的使用方法
Jul 27 Javascript
如何在面试中手写出javascript节流和防抖函数
Oct 22 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
PHP开发的一些注意点总结
2010/10/12 PHP
php设计模式 DAO(数据访问对象模式)
2011/06/26 PHP
php中file_get_contents()函数用法实例
2019/02/21 PHP
Cookie跨域问题解决方案代码示例
2020/11/24 PHP
javaScript同意等待代码实现心得
2011/01/01 Javascript
js获取select标签的值且兼容IE与firefox
2013/12/30 Javascript
7个JS基础知识总结
2014/03/05 Javascript
js变量、作用域及内存详解
2014/09/23 Javascript
javascript检测两个数组是否相似
2015/05/19 Javascript
跟我学习javascript的var预解析与函数声明提升
2015/11/16 Javascript
javascript时间排序算法实现活动秒杀倒计时效果
2021/01/28 Javascript
只需五句话搞定JavaScript作用域(经典)
2016/07/26 Javascript
Angular2 Service实现简单音乐播放器服务
2017/02/24 Javascript
JavaScript实现前端分页控件
2017/04/19 Javascript
js禁止浏览器的回退事件
2017/04/20 Javascript
BootStrap表单控件之文本域textarea
2017/05/23 Javascript
jQuery Validate表单验证插件实现代码
2017/06/08 jQuery
使用vue官方提供的模板vue-cli搭建一个helloWorld案例分析
2018/01/16 Javascript
实例详解vue.js浅度监听和深度监听及watch用法
2018/08/16 Javascript
改进 JavaScript 和 Rust 的互操作性并深入认识 wasm-bindgen 组件
2019/07/13 Javascript
推荐几个不错的console调试技巧实现
2019/12/20 Javascript
在微信小程序中渲染HTML内容3种解决方案及分析与问题解决
2020/01/12 Javascript
[02:06]DOTA2英雄基础教程 暗影萨满
2013/12/16 DOTA
Python面向对象之类的封装操作示例
2019/06/08 Python
如何基于python实现画不同品种的樱花树
2020/01/03 Python
从多个tfrecord文件中无限读取文件的例子
2020/02/17 Python
Python中if有多个条件处理方法
2020/02/26 Python
Python3 用matplotlib绘制sigmoid函数的案例
2020/12/11 Python
AmazeUI折叠式卡片布局,整合内容列表、表格组件实现
2020/08/20 HTML / CSS
纽约通行卡:The New York Pass(免费游览纽约90多个景点)
2017/07/29 全球购物
装饰资料员岗位职责
2013/12/30 职场文书
2014年大学生自我评价
2014/01/19 职场文书
安全标语口号
2014/06/09 职场文书
python爬取网页版QQ空间,生成各类图表
2021/06/02 Python
一篇文章弄懂Python关键字、标识符和变量
2021/07/15 Python
Java Lambda表达式常用的函数式接口
2022/04/07 Java/Android