jquery - 使用 $(this) 选择器调用用户定义的 Jquery 函数

Question

我正在尝试创建一个函数来在单击圆圈时隐藏该圆圈。

我认为我的语法是正确的，但当我单击圆圈时没有任何反应。

我有以下代码:

function Disappearing() {
  $(this).hide();
}

$(".circle").click(function() {
  Disappearing();
})

.circle {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  margin-bottom: 5px;
}

#red {
  background-color: red;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="red" class="circle"></div>

Answer 1

Disappearing() 无法访问单击的对象，除非将其传递给该函数，换句话说 this 指向事件函数中的当前对象，因此您应该得到click 事件中的 $(this) ，然后将其传递给 Disappearing() 。

试试这个:

function Disappearing (circle) {
   circle.hide();
}
    		
$(".circle").click(function() {
	Disappearing($(this));		
});
 

.circle {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  margin-bottom: 5px;
}
#red {
  background-color: red;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="red" class="circle"></div>