写前端时发现当我用onclick传json数据后,发现函数接收数据为[object object],无法取到值。
页面打印查看,json未传时能正确取值,传值后json为空值。
然后就查找资料详细了解下 [object Object] 是怎么出来的。
js 中 toString 方法的作用是返回一个反映这个对象的字符串,可参考下表:
所以为什么传值后是 [object Object] 字符串,而不是json对象。
第一次修改
我尝试调用 JSON.stringify 方法先将json转为json字符串进行传值
结果页面竟然报Uncaught SyntaxError: Invalid or unexpected token 或 Uncaught SyntaxError: Invalid or unexpected end of input。错误翻译:无效或意外的标记
后来我发现这个错误是由于json字符串,它的双引号与onclick控件的双引号起冲突了。
解决方法,onclick里单引号与双引号互换
如果我们单独传一个字符串参数,我们是需要加 / 对其转译,但是JSON序列化之后的字符串,正是自定义对象本身的数据结构。因此我去掉\
第二次修改 去掉\
json传值成功。
为什么会出现 onClick([object object]) ?
出现这种情况,就是我们渲染 dom 节点的时候,是用的字符串拼接形式。所以,对于 onclick 事件中的参数,我们也因该转化成字符串的形式进行拼接。如果传入一个 js 自定义object,那么页面渲染后就会显示[object object]。
为什么会出现 Uncaught SyntaxError: Invalid or unexpected token ?
由于json字符串,它的双引号与onclick控件的双引号起冲突了