divイベントの位置をクリックします...
5400 ワード
背景:複数のdiv、共通点classNameを持ち、クリックすると同じイベントがトリガーされます.機能:クリックイベントをトリガーするdivの背景色が赤に変わり、他のdivの背景色が緑になります.実現構想:
$(this)キーワードでクリックをトリガーするdivを取得し、まずすべての現在のdivの背景色を緑色に設定し、次に現在のdivの背景色を赤色に設定する.$(this)について:thisとの最大の違いはjqueryオブジェクトであり、thisと同様に現在のオブジェクトを表すことである.
<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_1div>
<div class="div1" id="a2">div_2div>
<div class="div1" id="a3">div_3div>
<div class="div1" id="a4">div_4div>
<div class="div1" id="a5">div_5div>
<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>