关于js&Jquery中单击事件的绑定时常见错误及解决方案

最新推荐文章于 2022-03-10 17:05:35 发布

身披黑暗，脚踩光明

最新推荐文章于 2022-03-10 17:05:35 发布

阅读量427

点赞数

本文链接：https://blog.csdn.net/W_Cai_niao/article/details/106905529

版权

   **在写js代码时，常会出现绑定了单击事件，但会报出not defined的错误，在此结合自己code过程中碰到的一些常见问题进行总结。
     (P.S:下述body中的代码只截取了一行，旨在表明是否能成功执行而已。)**

1.将单击事件绑定在html标签体内部的情况

单击事件运行成功。直接将函数放置在script标签中。

<body>
	<input type="checkbox" onclick="selectAll(this)" >
</body>

<script>
function selectAll(obj){
                //获取下边的复选框
				$(".itemSelect").prop("checked",obj.checked);
            }
</script>

单击事件运行成功。将函数放置在入口函数中。

<body>
	<input type="checkbox" onclick="selectAll(this)" >
</body>

<script>
$(function () {
			selectAll = function(obj){
                $(".itemSelect").prop("checked",obj.checked);
			}
        })
</script>

单击事件运行失败。也是将函数放置在入口函数中，但注意与上一种函数定义方式的区别。

<body>
	<input type="checkbox" onclick="selectAll(this)" >
</body>

<script>
$(function () {
				function selectAll(obj){
				    $(".itemSelect").prop("checked",obj.checked);
				}
            })
</script>

2.将单击事件绑定在script标签中的情况

单击事件运行成功。Jquery写法。

<body>
	<input type="checkbox" id="selectAll" >
</body>

<script>
	$(function(){
				    $("#selectAll").click(function () {
				        $(".itemSelect").prop("checked",this.checked);
	                })
				})
</script>

单击事件运行成功。js写法。

<body>
	<input type="checkbox" id="selectAll" >
</body>
<script>
	$(function () {
					var selectAll = document.getElementById("selectAll");
					selectAll.onclick = function(){
	                    $(".itemSelect").prop("checked",this.checked);
					}
            })
</script>

身披黑暗，脚踩光明

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
关于js&Jquery中单击事件的绑定时常见错误及解决方案

**在写js代码时，常会出现绑定了单击事件，但会报出not defined的错误，在此结合自己code过程中碰到的一些常见问题进行总结。**1.将单击事件绑定在html标签体内部的情况单击事件运行成功。直接将函数放置在script标签中。<body> <input type="checkbox" onclick="selectAll(this)" ></body><script>function selectAll(obj){ ...
复制链接

扫一扫