Liaison d'événement
Opération simple de l'événement jquery :
1. liaison d'événement jquery
$().bind (type d'événement, gestion des événements de fonction);
$ () .bind(Type 1 Type 2 Type 3, traitement des événements); //Lier le même processus à de nombreux types d'événements différents
$().bind(json object); différents types d'événements
(Type d'événement : clic sur survol de la souris, flou de mise au point, etc.)
Traitement des événements : fonction nommée, fonction anonyme
<!DOCTYPE html>
<html>
<head>
<title>php.cn</title>
<meta charset="utf-8" />
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script>
//同一个对象绑定多个click事件
$(function(){
$('div').bind('click',function(){
console.log('谁在碰我？');
});
$('div').bind('click',function(){
console.log('谁又在碰我？');
});
$('div').bind('mouseover',function(){
//给div设置背景色
$(this).css('background-color','lightgreen');
});
$('div').bind('mouseout',function(){
//给div设置背景色
$(this).css('background-color','lightblue');
});
});
</script>
<style type="text/css">
div {width:300px; height:200px; background-color:lightblue;}
</style>
</head>
<body>
<div></div>
</body>
</html>1.2 Annuler la liaison d'événement
① $().unbind(); //Annuler tous les événements
② $().unbind(event type); //Annuler les événements du type spécifié
③ $().unbind(event type, Processing); //Annuler l'événement de traitement spécifié du type spécifié
Remarque : pour le ③ type d'annulation de la liaison d'événement, le traitement de l'événement doit être une fonction nommée.
<!DOCTYPE html>
<html>
<head>
<title>php.cn</title>
<meta charset="utf-8" />
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script>
//unbind()取消事件绑定操作
//以下f1和f2要定义到最外边，使用没有任何影响
function f1(){
console.log(1111);
}
function f2(){
console.log(2222);
}
$(function(){
$('div').bind('click',function(){
console.log('谁在碰我？');
});
$('div').bind('click',function(){
console.log('谁又在碰我？');
});
$('div').bind('click',f1);
$('div').bind('click',f2);
$('div').bind('mouseover',function(){
//给div设置背景色
$(this).css('background-color','lightgreen');
//$('div').css('background-color','lightgreen');
});
$('div').bind('mouseout',function(){
//给div设置背景色
$(this).css('background-color','lightblue');
//$('div').css('background-color','lightgreen');
});
});
function cancel(){
//取消事件绑定
$('div').unbind(); //取消全部事件
}
</script>
<style type="text/css">
div {width:300px; height:200px; background-color:lightblue;}
</style>
</head>
<body>
<div></div>
<input type="button" value="取消" onclick="cancel()">
</body>
</html>La liaison d'événement n'est qu'une forme d'opérations événementielles riches.
section suivante