onclick传递对象

已于 2023-06-06 15:41:48 修改
阅读量317 收藏
点赞数
文章标签： javascript 前端 vue.js
于 2023-05-09 09:52:05 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/AAA3A12/article/details/130573394
版权
文章展示了如何在JavaScript中定义一个对象data，并将其转化为字符串通过onclick事件传递。使用JSON.stringify转换数据并替换双引号以避免语法错误。点击事件触发的方法xxx接收到数据后在控制台打印出来。
摘要由CSDN通过智能技术生成 
// 定义data为object数据,xxx为方法名
let data = ...

// ...
onclick="xxx(' + JSON.stringify(data).replace(/"/g, '"')+')"

function xxx(data){
	// 输出object对象
	console.log(data)
}
忆枫717
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
Spring boot + thymeleaf 后端直接给onclick函数赋值的实现代码
08-30
"Spring Boot + Thymeleaf 实现后端直接给 onclick 函数赋值的知识点" Spring Boot 是一个基于 Java 的框架，用于构建基于 Web 的应用程序，而 Thymeleaf 是一个基于 XML 的模板引擎，用于生成 HTML 内容。在 ...
javascript setTimeout()传递函数参数(包括传递对象参数)
12-07
在给定的示例中，作者遇到的问题是如何在`setTimeout`中传递对象参数。常规的做法是直接传递函数名和参数，但这在需要传递对象时会变得复杂。作者尝试了一种方法，将函数和参数用字符串拼接，如`setTimeout("fun(" +...
js onclick事件方法传递参数为对象
Danger
04-01 7370
选择适合自己场景得方法 1.传json对象 var object= {id: 123, name: 'name1', age: 10}; var jsonObj = '<a οnclick="dotest(' + JSON.stringify(object).replace(/"/g, '&quot;') + ');">json对象传递</a>'; 2.传j...
【前端攻城师之JS基础】10事件对象
zbcwmq的博客
10-26 458
当事件被触发时，浏览器会调用响应函数，同时将一个事件对象作为实参传递给响应函数在事件对象中封装了当前事件相关的一切信息，包括鼠标的坐标，哪个按键被按下，鼠标滚轮滚的方向等可以在响应函数中定义一个形参，来使用事件对象，但是在IE8以下浏览器中事件对象没有做实参传递，而是作为window对象的属性保存，以下方法兼容IE8和其他浏览器元素.事件 = function(event){};元素.事件 = function(e){};
javascript对于onclick事件传值不可以直接传对象的解决办法
sky21sjwzk的博客
03-30 1330
我们可以使用内置的json处理函数进行处理 JSON.stringify(obj).replace(/“”/g,“'”),经过这样处理函数接受到就会变成对象进行处理。Js在渲染 Dom 节点的时候，是要用的字符串拼接形式,所以在对于onlcick事件参数，我们应该转化为字符串的形式进行拼接。我们要将传递的参数先转化为一个json的字符串，并且若在需要的时候再吧json字符串用双引号转化为单引号即可。javascript对于onclick事件传值不可以直接传对象的解决办法。
JS中onclick方法调用函数时如何传递对象参数
热门推荐
来日可期的博客
11-30 1万+
今天在拼接字符串时加入了onclick事件出发的函数需要传递参数对象，结果遇到了一系列问题，特此记录 我是想用ajax接收后台传递的json数据，在成功的回调函数里拼接字符串，然后替换文本。 第一次我是这样拼接的 success : function(data){ console.log(data); ...
按钮如何将自身传递给它在onclick后调用的函数
weixin_35754962的博客
02-12 171
按钮可以通过在 onclick 事件监听函数中使用 "this" 关键字来将自身传递给被调用的函数。例如： <button id="myButton">Click me</button> <script> document.getElementById("myButton").addEventListener("click", function() { ...
A标签中通过href和onclick传递的this对象实现思路
12-03
当涉及到在`<a>`标签上同时使用`href`属性和`onclick`事件时，`this`对象的行为可能会变得复杂，特别是在想要传递当前元素引用给一个处理函数时。本文将详细解释这个问题，并提供解决思路。 首先，`this`关键字在...
js onclick事件传参讲解
10-26
在定义.onclick事件处理器时，我们常常需要向函数传递参数，以实现更复杂的交互功能。 在JavaScript中实现onclick事件传参主要有几种方法。首先，如果需要在点击事件中将当前点击的元素对象传递给事件处理器函数，...
渲染HTML代码使用onclick方法传递对象作为参数
最新发布
qq_50580366的博客
12-09 176
使用如上代码替换对象中的引号，否则会解析异常。
前端HTML拼接时，用onclick等方法传递对象解决办法
Mr_WoLong
04-21 584
在列表中需要把对象传入到函数中时方法如下。
spring mvc 传递对象 二
weixin_34082695的博客
12-01 194
springController: [java]view plaincopy @Controller @RequestMapping("/user") publicUserControllerextendsBaseController{ @RequestMapping("/addUser...
onclick事件传递对象参数
weixin_33682790的博客
05-15 1870
　　onclick 无法直接传递对象参数，需要将对象处理一下 　　“js对象” 和 “json ” ：js 在接收json 时能自动转化为js 对象；而例如HTML 中函数传递时，对象的传递只能转为json 来传！ 　　 <a href="#"onclick="editName(JSON.stringify(data).replace(/"/g, '&quot;'))"&g...
JavaScript中onClick传递对象参数出现错误：uncaught SyntaxError:Unexpected identifier
越界的博客
08-09 5639
JavaScript中onClick传递对象参数出现错误：uncaught SyntaxError:Unexpected identifier 在使用EasyUI的datagrid（数据表格），给特定的单元格onClick事件，点击单元格获取该单元格所在行的数据时会报Sncaught SyntaxError: Unexpected identifier错误。 经过排查，onclick（对象）这种...
在onclick事件中传递对象参数
weixin_30566111的博客
05-15 701
1.传json对象 var obj = {id: 1, name: 'jimc', age: 20}; var jsonObj = '<a onclick="show(' + JSON.stringify(obj).replace(/"/g, '&quot;') + ');">查看</a>'; 2.传json字符串 var obj = {id...
有关javascript中事件对象e
qq_44718039的博客
11-15 2697
js中的事件对象e
在字符串拼接时向click事件传递一个对象的方法
m0_47587616的博客
08-07 1406
场景 在进行js字符串拼接的时候有时候会遇到需要在一段字符串的onclick事件中传递的参数是一个对象的问题，传递之后我们会发现并不是我们想要的结果（主要是不想一个参数一个参数的去写，有时候参数太多就会显得太过臃肿）。 举例 如下： <span onclick="f1([object Object])">点我</span> 可以看到f1()方法内的参数变成了[object Object]，这样的参数我们是没办法通过 xx.xx 这种格式进行数据操作的，有一种比较简单粗暴的方式是通过
thymeleaf th:onclick 传递对象
09-02
对于Thymeleaf中的th:onclick属性，您可以使用JavaScript函数来传递对象。下面是一个示例： ```html <!DOCTYPE html> function handleClick(obj) { // 在这里处理传递的对象 console.log(obj); } ${your...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

忆枫717

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值