JQ事件绑定和移除

最新推荐文章于 2024-05-25 13:36:04 发布

Fade Away

最新推荐文章于 2024-05-25 13:36:04 发布

阅读量1.6k

点赞数

分类专栏： JQ

本文链接：https://blog.csdn.net/qq_26239917/article/details/90027021

版权

JQ 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

绑定是on
移除是off
这是移除具体的某一个时事件的函数
也可以移除某一类事件
$(".count").on(“click”, “span”,count_on);
$(".count").off(“click”, “span”,count_on);

这里思考的是 count_on(event)这个event是哪里来的，在JQ底层有这么一句

$(".count span .add").click(count_on) JQ
–>
ele.onclick = count_on; JS
count_on 这个时候接收到了一个event参数
只要是被event触发的函数，这个函数都会接收到这个event对象

function count_on(event){
					console.log(arguments);
					console.log("event",event);
					console.log("event.target",event.target);
					var target = event.target;
					//add
					if (target.className == "add") {
						$(".count").off("click", "span",count_on);
						console.log("offed");
						var num = $(this).prev(); //prev 是一个集合  
						var reduce = $(this).prev().prev(); //prev 是一个集合  
						var subtotal = $(this).parent().next();
						num.val(num.val() * 1 + 1); //输入框
						if (num.val() * 1 > 1) {
							reduce.html("-");
						}
						var numValue = num.val() * 1;
						var priceValue = $(this).parent().prev().html() * 1;
						subtotal.html((numValue * priceValue).toFixed(2));
						//计算总计
						countSumAndPrice();
						check();
						//add.php
						var id = this.getAttribute("cart_id");
						$.ajax({
							url: "../php/numChange.php",
							data: {
								id: id,
								keyword: "add"
							},
							type: "get",
							dataType: "json",
							success: function (obj) {
								console.log(obj);
								$(".count").on("click", "span",count_on);
							}
						})

					}

					//reduce
					if (target.className == "reduce") {
						console.log("offed");
						$(".count").off("click", "span",count_on);
						var num = $(this).next();
						var subtotal = $(this).parent().next();
						// var reduce = $(this).prev().prev();
						num.val(num.val() * 1 - 1);
						if (num.val() == 1) {
							$(this).html("");
						}
						// else {
						// 	num.val(num.val() * 1 - 1);
						// }
						//获取
						var numValue = num.val() * 1;
						var priceValue = $(this).parent().prev().html() * 1;
						subtotal.html((numValue * priceValue).toFixed(2));
						countSumAndPrice();
						check();
						//reduce.php
						var id = this.getAttribute("cart_id");
						$.ajax({
							url: "../php/numChange.php",
							data: {
								id: id,
								keyword: "reduce"
							},
							type: "get",
							dataType: "json",
							success: function (obj) {
								console.log(obj);
								$(".count").on("click", "span",count_on);
							}
						})
					}
				// })
				}
				//监听
				$(".count").on("click", "span",count_on);

这个被事件触发的函数接收到的event

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<button type="button">点击</button>
	</body>
	<script type="text/javascript" src="jquery-1.11.3.js">
		
	</script>
	<script type="text/javascript">
		$("button").click(but);
		function but(){
			console.log(arguments);
		}
	</script>
</html>

Fade Away

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JQ事件绑定和移除

绑定是on移除是off这是移除具体的某一个时事件的函数也可以移除某一类事件$(".count").on(“click”, “span”,count_on);$(".count").off(“click”, “span”,count_on);这里思考的是 count_on(event)这个event是哪里来的，在JQ底层有这么一句$(".count span .add").click(...
复制链接

扫一扫

专栏目录