跟大家講解下有關jQuery中bind()方法如何使用，相信小伙伴們對這個話題應該也很關注吧，現在就為小伙伴們說說jQuery中bind()方法如何使用，小編也收集到了有關jQuery中bind()方法如何使用的相關資料，希望大家看到了會喜歡。

本篇文章將分享的是有關jQuery中事件綁定的方法bind()，有一定的參考價值,希望對大家學習有所幫助！

jQuery處理事件最重要的兩種方法就是事件綁定bind()方法和事件移除unbind()方法,就是將代碼添加到一組元素上的一個或者多個事件中，今天將詳細的介紹bind()方法的使用

bind()方法

bind() 方法就是為被選元素添加一個或多個事件處理程序，并規定事件發生時運行的函數。

$(selector).bind(event,data,function)

event ：規定添加到元素的一個或多個事件，可用空格分隔多個事件而且必須是有效的事件。

data ：指傳遞到函數的額外數據。

function ：指當事件發生時運行的函數

例

<a href="#">Test 1</a><a href="#">Test 2</a><script src="jquery/jquery-1.12.4.js"></script><script>$(function(){//入口函數$("a").bind("click", function() {alert($(this).text());});});

結果

當點擊a鏈接時，由于a鏈接綁定了事件click，所以點擊時會彈出一個框顯示內容，jQuery會自動將單擊的元素分配給匿名函數內的“this”關鍵字，允許訪問激活元素的元素，同時可以觸發多個事件

<div id="div" style="background-color:pink;width:100px;height:100px;"></div><script src="jquery/jquery-1.12.4.js"></script><script>$("#div").bind("mousemove", function(event){$(this).text(event.pageX + "," + event.pageY);});

結果

我們創建一個長和寬都為100px,粉色的一個div元素。對于這個div，我們使用帶有名為“event”的參數的匿名函數綁定mousemove事件，當鼠標滑過時我們可以訪問到pageX和pageY屬性，告訴我們鼠標光標當前在頁面的哪個位置，顯示在盒子的左上角。將光標移動到div元素不同的地方上，將可以看到不同的值更新顯示

bind（）方法還可以通過data傳入自己的數據并讓事件對象訪問它，也可以在綁定事件時設置值，并且能夠在調用事件時讀取此值

<a href="#">Test 1</a><a href="#">Test 2</a><script src="jquery/jquery-1.12.4.js"></script><script>var text = "Hello, world!";$(function(){$("a").bind("click", {message:text},function(event) {text = "hello";console.log(event.data.message);});});</script></script>

結果

我們將值作為bind（）方法的輔助參數傳遞，作為鍵和值的映射，通過用逗號分隔它們來傳遞多個值。我們使用事件對象的data屬性。此屬性包含已傳遞的每個值的子屬性，這意味著您可以使用event.data.message訪問message參數的值。 雖然在事件處理程序中更改了“text”變量的值，但程序運行結果還是“Hello，world！”

總結：以上就是本篇文章的內容了，希望對大家學習jQuery事件綁定有所幫助。

以上就是jQuery中bind()方法如何使用的詳細內容，更多請關注php中文網其它相關文章！

來源：php中文網