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);" onclick="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);' onclick='sendTcMail("+objStr+")'>test</a>";
$('#test').html(a);
}
这样拼接就没问题了,最终拼接完之后objStr中的双引号会自动去掉的,所有组成的字符串a中,onclick方法sendTcMail中的参数传递的是json对象obj,并不是json字符串objStr。这点要清楚。
只要遇到拼接字符串,中间还有用到变量,那变量一定也要是字符串类型,如果是对象去直接拼接,就会是对象引用,不是我们要的对象内容,一定要注意。
js拼的onclick调用方法需要注意的地方 之二的更多相关文章
- js拼的onclick调用方法需要注意的地方 之一
1.首先,明确一点,js方法中参数可以传递字符串,对象,number类型等,对象传递的是引用,方法中修改了,会影响到方法外面的对象. 2.下面重现项目中遇到的一个问题:(其实就是要明白通过引号来拼接字 ...
- iOS js oc相互调用(JavaScriptCore)---js调用iOS --js里面通过对象调用方法
下来我们看第二种情况 就是js 中是通过一个对象来调用方法的. 此处稍微复杂一点我们需要使用到 JSExport 凡事添加了JSExport协议的协议,所规定的方法,变量等 就会对js开放,我们可以通 ...
- 转载 OS js oc相互调用(JavaScriptCore) ---js调用iOS ---js里面直接调用方法
OS js oc相互调用(JavaScriptCore) 接着上节我们讲到的iOS调用js 下来我们使用js调用iOS js调用iOS分两种情况 一,js里面直接调用方法 二,js里面通过对象调用 ...
- Js拼Json对象
我们通常会拼字符串,但是拼字符串的话,遇见占位符会出错. 下面分享一个拼js拼json对象的方法: var jsonArr = []; $ ...
- 关于js中函数的调用问题
js中函数的调用方法 1.直接调用 函数名(参数): 2.通过指向函数的变量去调用 例如: var myval = 函数名: 此刻 myval是指向函数的一个指针: myval(实际参数):此刻调用的 ...
- angularjs $swipe调用方法
angularjs 的$swipe,用法: $swipe.bind(angular.element(document),{ start: function(pos) { }, move: functi ...
- 【JS】<a>标签调用js中函数的几种方法
我们常用的在a标签中有点击事件: a href="javascript:js_method();" 这是我们平台上常用的方法,但是这种方法在传递this等参数的时候很容易出问题,而 ...
- Magento中调用JS文件的几种方法
一.全局调用方法: 通过该方法每个页面都会引用这个JS文件,除非是类似jQuery这样的系统文件,不然不推荐这种方法. 文件路径:/app/design/frontend/default/Your_T ...
- JS函数的定义与调用方法
JS函数调用的四种方法:方法调用模式,函数调用模式,构造器调用模式,apply,call调用模式 1.方法调用模式:先定义一个对象,然后在对象的属性中定义方法,通过myobject.property来 ...
随机推荐
- 遇到IIS configuration error错误的可以看看,不一定是权限问题
最近接手了别人的一个 DOT NET项目,编译.调试一切都OK(心里暗暗高兴),发布吧,结果放到服务器上一运行出现Configuration Error错误,提示:“Access to the pat ...
- linux.1:创建分区和文件系统
概述 使用 fdisk.gdisk 和 parted 创建和修改 MBR 和 GPT 分区在本教程中,学习磁盘分区和 Linux 文件系统相关内容,包括学习如何: 使用 mkfs 命令设置 ext2. ...
- zabbix监控入门初步
1.Zabbix是什么? Zabbix是一个基于Web界面的分布式系统监控的企业级开源软件.可以监视各种系统与设备的参数,保障服务器及设备的安全运营. 2.Zabbix的功能和特性 (1)安装与配置简 ...
- js判断undefined类型,undefined,null, 的区别详细解析
js判断undefined类型 今天使用showModalDialog打开页面,返回值时.当打开的页面点击关闭按钮或直接点浏览器上的关闭则返回值是undefined所以自作聪明判断 var reVal ...
- Java中byte转换int时与0xff进行与运算的原因
http://w.baike.com/LGAdcWgJBBQxRAHUf.html 转帖 java中byte转换int时为何与0xff进行与运算 在剖析该问题前请看如下代码 public static ...
- ubuntu 安装 phpstorm
phpstorm是用JAVA开发的,所以在安装之前需要先安装jdksudo apt-get install default-jdk从官网上下载phpstorm 的linux版本 http://www. ...
- Data Structure Binary Tree: Morris traversal for Preorder
http://www.geeksforgeeks.org/morris-traversal-for-preorder/ #include <iostream> #include <v ...
- 第二篇 dom内容操作之value
一.内容操作的三种方式 . 详情看第一篇 innerText innerHtml . value ==>表单类的标签 input >text passwd textarea . check ...
- android电池(四):电池 电量计(MAX17040)驱动分析篇【转】
本文转载自:http://blog.csdn.net/xubin341719/article/details/8969369 电池电量计,库仑计,用max17040这颗电量IC去计量电池电量,这种方法 ...
- poj 1426 Find The Multiple 搜索进阶-暑假集训
E - Find The Multiple Time Limit:1000MS Memory Limit:10000KB 64bit IO Format:%I64d & %I6 ...