解决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 相关文章推荐
JQuery自适应IFrame高度(支持嵌套 兼容IE,ff,safafi,chrome)
Mar 28 Javascript
js中页面的重新加载(当前页面/上级页面)及frame或iframe元素引用介绍
Jan 24 Javascript
对 jQuery 中 data 方法的误解分析
Jun 18 Javascript
jQuery中append()方法用法实例
Dec 25 Javascript
JavaScript 常见安全漏洞和自动化检测技术
Aug 21 Javascript
javascript特效实现——当前时间和倒计时效果的简单实例
Jul 20 Javascript
微信小程序 图片等比例缩放(图片自适应屏幕)
Nov 16 Javascript
基于javascript实现的快速排序
Dec 02 Javascript
Vuejs 单文件组件实例详解
Feb 09 Javascript
vue两个组件间值的传递或修改方式
Jul 04 Javascript
微信小程序项目实践之验证码倒计时功能
Jul 18 Javascript
JavaScript遍历DOM元素的常见方式示例
Feb 16 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
8个出色的WordPress SEO插件收集
2011/02/26 PHP
php验证手机号码(支持归属地查询及编码为UTF8)
2013/02/01 PHP
深入php define()函数以及defined()函数的用法详解
2013/06/05 PHP
静态的动态续篇之来点XML
2006/08/15 Javascript
jquery 可排列的表实现代码
2009/11/13 Javascript
jQuery html()等方法介绍
2009/11/18 Javascript
导入extjs、jquery 文件时$使用冲突问题解决方法
2014/01/14 Javascript
JavaScript取得WEB安全颜色列表的方法
2015/07/14 Javascript
jQuery点击改变class并toggle及toggleClass()方法定义用法
2015/12/11 Javascript
Jquery 自定义事件实现发布/订阅的简单实例
2016/06/12 Javascript
jquery表单验证实例仿Toast提示效果
2017/03/03 Javascript
javascript深拷贝、浅拷贝和循环引用深入理解
2018/05/27 Javascript
nodejs一个简单的文件服务器的创建方法
2019/09/13 NodeJs
vue-admin-template配置快捷导航的代码(标签导航栏)
2020/09/04 Javascript
js实现简单的点名器随机色实例代码
2020/09/20 Javascript
基于vue实现微博三方登录流程解析
2020/11/04 Javascript
[40:55]DOTA2上海特级锦标赛主赛事日 - 2 败者组第二轮#4Newbee VS Fnatic
2016/03/03 DOTA
Python数据结构与算法之图结构(Graph)实例分析
2017/09/05 Python
使用python3+xlrd解析Excel的实例
2018/05/04 Python
对Python 窗体(tkinter)树状数据(Treeview)详解
2018/10/11 Python
哪些是python中web开发框架
2020/06/17 Python
使用Python制作一个数据预处理小工具(多种操作一键完成)
2021/02/07 Python
CSS3的Flexbox布局的简明入门指南
2016/04/08 HTML / CSS
CSS3制作气泡对话框的实例教程
2016/05/10 HTML / CSS
html5摇一摇代码优化包括DeviceMotionEvent等等
2014/09/01 HTML / CSS
孕妇内衣和胸罩:Cake Maternity
2018/07/16 全球购物
博朗(Braun)俄罗斯官方商店:德国小家电品牌
2019/09/24 全球购物
Kipling澳洲官网:购买凯浦林包包
2020/12/17 全球购物
如何进行Linux分区优化
2013/02/12 面试题
银行实习的自我鉴定
2013/12/10 职场文书
大二法学专业职业生涯规划范文
2014/02/12 职场文书
应届生自荐信
2014/06/30 职场文书
2014年保卫科工作总结
2014/12/05 职场文书
七年级上册语文教学计划
2015/01/22 职场文书
用Python提取PDF表格的方法
2021/04/11 Python
Django对接elasticsearch实现全文检索的示例代码
2021/08/02 Python