js onclick传参问题

毛逗豆

已于 2022-02-16 19:33:19 修改

阅读量3.6k

点赞数 1

文章标签： javascript 前端开发语言

于 2022-02-16 19:25:30 首次发布

本文链接：https://blog.csdn.net/weixin_44339190/article/details/122857735

版权

做东西的时候，遇上一个需求，就是当给一个组件绑定点击事件的时候，想传递一个参数过去。
具体的说，这个需求大概是这样子的：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>配置文件</title>
    <script>
		var button =document.createElement("testButton");
		button.onclick = test;
		
		function test(){
			alert('无参数');
		}
	</script>
</head>
<body>
<button id="testButton">点点</button>
</body>
</html>

上边这个代码，点击button就会调用 test() 这个函数，那如果我想调用 test() 的时候想给他传个参数呢。
直接把button.onclick = test;改成button.onclick = test(1);

下边的

function test(){
	alert('无参数');
}

改成

function test(a){
	alert('有参数：' + a);
}

这样子改是不行的
我发现一种方式，可以这样写

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>配置文件</title>
    <script>
		var button =document.createElement("testButton");
		button.onclick = function(){
			test(1)
		}
		
		function test(a){
			alert('有参数：' + a);
		}
	</script>
</head>
<body>
<button id="testButton">点点</button>
</body>
</html>