js拼的onclick调用方法需要注意的地方之二

那如果之前的方法不行，想传递json对象怎么办呢？

使用下面这种方法，

getA = function(){var obj = {'projectId':123,'projectName':'aac'};var objStr = JSON.stringify(obj);console.info(objStr);var a = '<a href="javascript:void(0);" οnclick="sendTcMail('+objStr+')">test</a>';$('#test').html(a);    }

这里将json对象通过JSON.stringify(obj)方法转换成了json对象的字符串（其实就是obj外面加了双引号），就可以用在下面的a字符串中进行拼接，这样拼接出来，sendTcMail方法中就传递的是json对象，可是事实不如人意，浏览器渲染出来的并不是我们想要的效果，会发现引号错乱了，这是为什么呢？
原因就是：JSON.stringify(obj)方法转换的json字符串是通过双引号包裹的，虽然js单双引号都可以，但是在拼接a字符串时，最外层用的是单引号拼接的，所以拼接的objStr变量中也需要是用单引号包裹的；但是objStr变量是通过JSON.stringify(obj)方法来的，所以它并不是单引号就会出现拼接字符串引号不一致，导致浏览器解析html出来并不是我们想要的。

措施：将外层用双引号来拼接，修改如下：

getA = function(){var obj = {'projectId':123,'projectName':'aac'};var objStr = JSON.stringify(obj);console.info(objStr);var a = "<a href='javascript:void(0);' οnclick='sendTcMail("+objStr+")'>test</a>";$('#test').html(a);    }

这样拼接就没问题了，最终拼接完之后objStr中的双引号会自动去掉的，所有组成的字符串a中，onclick方法sendTcMail中的参数传递的是json对象obj，并不是json字符串objStr。这点要清楚。
只要遇到拼接字符串，中间还有用到变量，那变量一定也要是字符串类型，如果是对象去直接拼接，就会是对象引用，不是我们要的对象内容，一定要注意。

转载于:https://www.cnblogs.com/cainiao-Shun666/p/6861402.html

js拼的onclick调用方法需要注意的地方之二相关推荐

js按下回车键调用方法
js按下回车键调用方法下面有两种方法,要注意键盘上有两个"Enter"键,方法1对于数字区域的"Enter"键无效. 1.方法一: // mounted或cr ...
js阳历转农历调用方法
js阴历阳历转换代码,js阳历转农历调用教程如下: 输入一个日期计算结果:计算出对应的阴历或阳历 js实现代码: <!-- function CalConv(M){FIRSTYEAR = 19 ...
WebService 远程调用方法汇总
WebService 远程调用方法汇总一.Web Service 二.REST 三.RPC 一.Web Service webservice 即web服务,它是一种跨编程语言和跨操作系统平台的远程调 ...
标签中的onclick调用js方法传递多个参数的解决方案
标签中的onclick调用js方法传递多个参数的解决方案参考文章: (1)标签中的onclick调用js方法传递多个参数的解决方案 (2)https://www.cnblogs.com/twohea ...
Android和JS之间互相调用方法并传递参数
场景 Android中使用WebView加载本地html并支持运行JS代码和支持缩放: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/detail ...
利用js的闭包原理做对象封装及调用方法
创建一个js文件,名为testClosure.js: ? 1 2 3 4 5 6 7 8 9 (function () { function a() { alert('i am a') ...
paypal js调用方法整合方便以后使用
paypal js调用方法整合两种方式 client 调用api 两种方式 client(调用集成) server(调用api) 参考官方链接 client 直接用 let purchase_uni ...
js 拼写 html 调用后台数据，onclick调用函数
最近,项目开发发现有一些效果,需要自己在js下拼接html代码,做出想要的效果,但是分成两种:一种是html页面,这是多年前写静态页面时遇到一些问题,现在突然想起来,另一种是vue页面,这是最近遇到的 ...
HTML用onclick调用servlet的方法
HTML用onclick调用servlet的方法这是我写的第一篇CSDN博客. 我不知道servlet是不是过时了,但是因为学校还在教嘛,所以就想着发一条. 今天我捣鼓了半天在网上找了半天都很难找到 ...

js拼的onclick调用方法需要注意的地方之二

js拼的onclick调用方法需要注意的地方之二相关推荐

最新文章

热门文章

js拼的onclick调用方法需要注意的地方 之二

js拼的onclick调用方法需要注意的地方 之二相关推荐

最新文章

热门文章

js拼的onclick调用方法需要注意的地方之二

js拼的onclick调用方法需要注意的地方之二相关推荐