本篇文章帶給大家的內容是關於jQuery的事件是什麼？ jquery事件的介紹，有一定的參考價值，有需要的朋友可以參考一下，希望對你有幫助。
在DOM中提供了load事件用於頁面載入完畢之後執行機制，jQuery提供了ready（）方法實作相似的功能，但是存在以下的差異。
1.DOM中的load事件沒有任何的簡寫形式，但在jQuery的ready（）方法中提供了簡寫形式。
2.在HTML頁面載入完成以後，load事件才會被觸發；而在DOM節點樹載入完畢以後，ready（）方法就會被呼叫。
3.一個HTML頁面中只能存在一個load事件，但可以存在多個ready（）方法。
ready（）方法的語法結構：
1.$(document).ready(function(){});
2.$().ready(function(){});//简写
3.$(function(){});//简写jQuery中提供了bind（）方法完成綁定事件，語法如下
$element.bind(type,data,callback);
type:表示綁定事件的名稱，是字串類型，沒有'on'。
data：作為element.data屬性值傳遞給事件物件的額外資料物件(可選項)。
callback：表示綁定事件的處理函數。
範例程式碼如下：
<body>
<button id='btn'>按钮</button>
<script>
function click1(){
console .log('this is button,');
}
$('#btn').bind('click',click1);jQuery中提供了unbind（）方法來解綁事件。具體方法如下：
$element.unbind(type[,data，callback])；
$('#btn').unbind('click');//只传递事件名称，解绑定该事件的所有处理函数。
$('#btn').undind('click'click1);//传递时间名称和指定的处理函数，解绑定该事件的指定处理函数。<style>
#title {
width: 100px;
height: 20px;
border: 1px solid black;
}
ul {
list-style: none;
padding: 0;
display: none;
}
li {
width: 100px;
height: 20px;
border: 1px solid black;
}
</style>
</head>
<body>
<p id="title">菜单</p>
<ul>
<li>北京</li>
<li>南京</li>
<li>天津</li>
</ul>
<script>
// mouseover表示鼠标悬停在指定元素之上 mouseout表示鼠标从指定元素上移开
//jQuery支持链式操作，多事件绑定时，事件名称之间使用空格分离。
$('#title').bind('mouseover mouseout', function(){
if ($('ul').is(':hidden')) {
$('ul').css('display','block');
} else {
$('ul').css('display','none');
}
});
/*
unbind()方法
1.没有指定任何事件时 - 将指定元素的所有事件全部解绑定
2.指定一个事件名称时 - 将指定元素的指定当个事件解绑定
3.指定多个事件名称时 - 将指定元素的指定多个事件解绑定
*/
$('#title').unbind('mouseover mouseout');jQuery中提供多組事件綁定與解綁定的方法
1.bind()與unbind() - jQuery 3.0版本後刪除方法
2.on()與off()方法- jQuery 1.7版本後新增方法
其實bind()與unbind()的底層方法就是on()和off()
3.live()與die() - jQuery 1.7版本後刪除方法
作用- 實現事件委託
4.delegate()與undelegate() - jQuery 1.6版本後新增方法，jQuery
3.0版本後刪除方法
作用- 實作事件委託
5. one() - 為事件綁定一次性的函數
jQuery中提供了hover()方法模擬滑鼠懸停事件效果。
$element.hover(over,out);
範例程式碼如下：
<style>
#title {
width: 100px;
height: 20px;
border: 1px solid black;
}
ul {
list-style: none;
padding: 0;
display: none;
}
li {
width: 100px;
height: 20px;
border: 1px solid black;
}
</style>
</head>
<body>
<p id="title">菜单</p>
<ul>
<li>北京</li>
<li>南京</li>
<li>天津</li>
</ul>
<script>
$('#title').hover(function(){
$('ul').css('display','block');
},function(){
$('ul').css('display','none');
});
</script>
</body>jQuery中提供了trigger()方法用於模擬除法匹配元素綁定的事件
$element.trigger(type[,dat]);
<body>
<button id="btn">按钮</button>
<script>
// 绑定事件 - 由用户行为进行触发，调用处理函数
$('#btn').bind('click',function(){
console.log('this is button.');
});
// 模拟用户触发事件
$('#btn').trigger('click');
</script>
</body>相關推薦：
#以上是jQuery的事件是什麼？ jquery事件的介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章！
