So verwenden Sie die bind()-Methode in jQuery

In diesem Artikel geht es um die bind()-Methode der Ereignisbindung in jQuery. Sie hat einen gewissen Referenzwert und ich hoffe, dass sie für das Lernen aller hilfreich sein wird!

Die beiden wichtigsten Möglichkeiten für jQuery, Ereignisse zu verarbeiten, sind die Ereignisbindungsmethode bind() und die Ereignisentfernungsmethode unbind(), bei der Code zu einem oder mehreren Ereignissen in einer Gruppe von Elementen hinzugefügt wird Die Verwendung der bind()-Methode wird im Detail vorgestellt

bind()-Methode

bind()-Methode dient dazu, dem ausgewählten Element einen oder mehrere Ereignishandler hinzuzufügen . Und geben Sie die Funktion an, die ausgeführt werden soll, wenn das Ereignis auftritt.

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

event: Gibt ein oder mehrere Ereignisse an, die dem Element hinzugefügt werden sollen. Mehrere Ereignisse können durch Leerzeichen und getrennt werden müssen gültige Ereignisse sein.

Daten: bezieht sich auf die zusätzlichen Daten, die an die Funktion übergeben werden.

Funktion: bezieht sich auf die Funktion, die ausgeführt wird, wenn ein Ereignis auftritt

Beispiel

<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());

});
});

Ergebnis

Wenn ein Link wird angeklickt Wenn ein Link an das Klickereignis gebunden ist, wird beim Klicken ein Feld angezeigt, in dem der Inhalt angezeigt wird. jQuery weist das angeklickte Element automatisch dem Schlüsselwort „this“ in der anonymen Funktion zu und ermöglicht so den Zugriff auf das Element, das aktiviert wird das Element. Gleichzeitig können Sie mehrere Ereignisse auslösen

<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);});

Ergebnisse

Wir erstellen ein div-Element mit einer Länge und Breite von 100 Pixeln und Pink . Für dieses Div binden wir das Mousemove-Ereignis mithilfe einer anonymen Funktion mit einem Parameter namens „event“. Wenn sich die Maus bewegt, haben wir Zugriff auf die Eigenschaften pageX und pageY, die uns sagen, wo sich der Mauszeiger gerade auf der Seite befindet. wie in der oberen linken Ecke gezeigt. Bewegen Sie den Cursor an verschiedene Stellen des div-Elements, und Sie werden sehen, dass verschiedene Werte aktualisiert und angezeigt werden

Die bind()-Methode kann auch ihre eigenen Daten über Daten übergeben und dem Ereignisobjekt den Zugriff darauf ermöglichen. oder es kann in der Bindung verwendet werden. Legen Sie einen Wert fest, wenn ein bestimmtes Ereignis aufgerufen wird, und können Sie diesen Wert lesen, wenn das Ereignis aufgerufen wird

<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>

Ergebnis

Wir übergeben den Wert als Hilfsparameter an die bind()-Methode. Übergeben Sie ihn als Zuordnung von Schlüsseln und Werten und übergeben Sie mehrere Werte, indem Sie sie durch Kommas trennen. Wir verwenden das Datenattribut des Ereignisobjekts. Diese Eigenschaft enthält Untereigenschaften für jeden übergebenen Wert, sodass Sie über event.data.message auf den Wert des Nachrichtenparameters zugreifen können. Obwohl der Wert der Variable „text“ im Ereignishandler geändert wird, lautet das Ergebnis der Programmausführung immer noch „Hallo, Welt!“

Zusammenfassung: Das Obige ist der Inhalt dieses Artikels, ich hoffe, es wird helfen Jeder lernt die jQuery-Ereignisbindung. Es wird definitiv helfen.

Das obige ist der detaillierte Inhalt vonSo verwenden Sie die bind()-Methode in jQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!