Maison >interface Web >js tutoriel >Comment positionner l'événement click d'un div
Comment positionner l'événement click d'un div
- yuliaoriginal
- 2018-09-19 15:32:462257parcourir
Cet article parle principalement du positionnement des événements div click. Les amis dans le besoin peuvent s'y référer, j'espère qu'il pourra vous aider.
Arrière-plan : plusieurs divs, avec un nom de classe commun, déclenchent le même événement lorsqu'ils sont cliqués.
Fonction : La couleur d'arrière-plan du div qui déclenche l'événement de clic devient rouge et la couleur d'arrière-plan des autres divs est verte.
Idée d'implémentation : utilisez le mot-clé $(this) pour obtenir le div qui déclenche le clic. Tout d'abord, définissez la couleur d'arrière-plan de tous les div actuels sur vert, puis définissez la couleur d'arrière-plan du div actuel sur rouge.
À propos de $(this) : La plus grande différence par rapport à ceci est qu'il s'agit d'un objet jquery. De la même manière, il représente l'objet actuel.
<!DOCTYPE html><html>
<head>
<meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1">
<meta charset="UTF-8">
<link rel="stylesheet" href="../css/airTicket.css">
<script src="../js/jquery.min.js" ></script>
<style>
.div1{
background-color:#4CD964;
height:20px;
margin-top:10px;
}
</style>
</head>
<body>
<div class="div1" id="a1">div_1</div>
<div class="div1" id="a2">div_2</div>
<div class="div1" id="a3">div_3</div>
<div class="div1" id="a4">div_4</div>
<div class="div1" id="a5">div_5</div>
<script>
$(function(){
$(".div1").click(function(){
var id = $(this)[0].id;
conlose.log(id);
$('div').css("background-color","green");
$(this).css("background-color","red");
})
}) </script>
</body>
</html>Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!