解决Layui中templet中a的onclick参数传递的问题


Posted in Javascript onSeptember 20, 2019

以下是我的模板,主要用在列表页table中的按钮,点击弹窗展开详情页的功能。

<script type="text/html" id="contentTpl">
    <a href='javascript:;' class="layui-btn layui-btn-danger layui-btn-xs" οnclick='showContent("{{d.CONTENT}}")' >查看内容</a>
</script>

项目跑了许久,突然说点击查看内容没反应,查出原因是,d.CONTENT如果有单引号或者双引号会报js错误。

于是改成下面的形式解决问题。

<script type="text/html" id="contentTpl">
   <div><a href='javascript:;' class="layui-btn layui-btn-danger layui-btn-xs" οnclick=showContent('{{d.CONTENT}}') >查看内容</a></div>
</script>

直接去吃onclick的单引号,让浏览器渲染,因为在html中,普通的a标签的click事件也是可以不用带单引号或双引号的。

给后人提醒,小心进坑。

以上这篇解决Layui中templet中a的onclick参数传递的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
基于node.js的快速开发透明代理
Dec 25 Javascript
使用非html5实现js板连连看游戏示例代码
Sep 22 Javascript
Javascript学习笔记之函数篇(五) : 构造函数
Nov 23 Javascript
JQuery插入DOM节点的方法
Jun 11 Javascript
JS动态添加元素及绑定事件造成程序重复执行解决
Dec 07 Javascript
详解Vue快速零配置的打包工具——parcel
Jan 16 Javascript
Vue-cropper 图片裁剪的基本原理及思路讲解
Apr 17 Javascript
利用Node.js批量抓取高清妹子图片实例教程
Aug 02 Javascript
VUE中使用MUI方法
Feb 12 Javascript
Node.js 实现简单的无侵入式缓存框架的方法
Jul 21 Javascript
JavaScript中的this原理及6种常见使用场景详解
Feb 14 Javascript
谈一谈vue请求数据放在created好还是mounted里好
Jul 27 Javascript
解决layui动态添加的元素click等事件触发不了的问题
Sep 20 #Javascript
微信小程序里引入SVG矢量图标的方法
Sep 20 #Javascript
微信小程序实现图片翻转效果的实例代码
Sep 20 #Javascript
vue实现直播间点赞飘心效果的示例代码
Sep 20 #Javascript
vue+layui实现select动态加载后台数据的例子
Sep 20 #Javascript
layui 中select下拉change事件失效的解决方法
Sep 20 #Javascript
微信小程序实现打开并下载服务器上面的pdf文件到手机
Sep 20 #Javascript
You might like
关于PHP结束标签的使用细节探讨及联想
2013/03/04 PHP
PHP5.2中PDO的简单使用方法
2016/03/25 PHP
ThinkPHP中order()使用方法详解
2016/04/19 PHP
php实现的redis缓存类定义与使用方法示例
2017/08/09 PHP
增强的 JavaScript 的 trim 函数的代码
2007/08/13 Javascript
js获取电脑分辨率的思路及操作
2013/11/22 Javascript
js中用window.open()打开多个窗口的name问题
2014/03/13 Javascript
setInterval计时器不准的问题解决方法
2014/05/08 Javascript
跟我学Nodejs(二)--- Node.js事件模块
2014/05/21 NodeJs
jquery 中ajax执行的优先级
2015/06/22 Javascript
js与applet相互调用的方法
2016/06/22 Javascript
jQuery实现产品对比功能附源码下载
2016/08/09 Javascript
AngularJs  Understanding Angular Templates
2016/09/02 Javascript
利用jQuery实现打字机字幕效果实例代码
2016/09/02 Javascript
Bootstrap在线电子商务网站实战项目5
2016/10/14 Javascript
Angular4绑定html内容出现警告的处理方法
2017/11/03 Javascript
JavaScript基于面向对象实现的猜拳游戏
2018/01/03 Javascript
解决vue-cli3 使用子目录部署问题
2018/07/19 Javascript
详解Angular6 热加载配置方案
2018/08/18 Javascript
Vue中的情侣属性$dispatch和$broadcast详解
2019/03/07 Javascript
element-ui 远程搜索组件el-select在项目中组件化的实现代码
2019/12/04 Javascript
[00:36]DOTA2勇士令状莱恩声望物品——冥晶之厄展示
2018/05/25 DOTA
Python实现嵌套列表去重方法示例
2017/12/28 Python
Python 多维List创建的问题小结
2019/01/18 Python
在python中实现求输出1-3+5-7+9-......101的和
2020/04/02 Python
phonegap常用事件总结(必看篇)
2017/03/31 HTML / CSS
远东集团网络工程师面试题
2014/10/20 面试题
计算机网络毕业生自荐信
2013/10/01 职场文书
经典导游欢迎词大全
2014/01/16 职场文书
2014年导购员工作总结
2014/11/18 职场文书
2014年保险业务员工作总结
2014/12/23 职场文书
2015年个人自我剖析材料
2014/12/29 职场文书
2015年机关纠风工作总结
2015/05/15 职场文书
新学期开学标语2015
2015/07/16 职场文书
Nginx搭建rtmp直播服务器实现代码
2021/03/31 Servers
源码解读Spring-Integration执行过程
2021/06/11 Java/Android