jQuery click()

时间:2020-02-23 14:46:06  来源:igfitidea点击:

jQuery click()方法在单击HTML元素时触发。
此方法会将事件处理程序附加到click事件。
我们可以使用此事件处理程序对选定HTML元素进行所需的操作。

jQuery单击

jQuery click()事件语法:

  • click()

其中click()方法使用时不带参数。

  • click(处理程序)

处理程序可以是每次触发事件时执行的任何函数。

jQuery单击示例

以下示例演示了jQuery click()方法的用法。

<!DOCTYPE html>
<html>
<head>
<title>jQuery Click Event Example</title>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script> 
$(document).ready(function(){
$(".divClass1").click(function(){
  $( this ).slideUp("slow");
});
});
$(document).ready(function(){
$(".divClass2").click(function(){
  $( this ).html("Mouse Clicked");
});
});
</script>
 
<style> 
.divClass1
{
  padding:5px;
  text-align:center;
  background-color:yellow;
  border:solid 1px;
}
.divClass2
{
  padding:5px;
  text-align:center;
  background-color:grey;
  border:solid 1px;
}
</style>
</head>
<body>

<div class="divClass1">click me to slide Up</div>
<div class="divClass2">Click Me to Change Text</div>

</body>
</html>

在此示例中,您可以看到单击<div>元素时触发了click()方法。
在此方法中,我们传递一个处理程序以进行滑动过渡并更改所选<div>元素HTML文本。
每次触发click事件时,都会执行slideUp()方法。