jQuery Begivenheder

jQuery er designet til specifik eventhåndtering.

jQuery event-funktioner

jQuery eventhåndteringsmetoder er kernefunktioner i jQuery.

En eventhåndteringsprogram er en metode, der kaldes, når der sker visse begivenheder i HTML. Termbegrebet 'udløst' (eller 'udløst') bruges ofte.

jQuery-kode plejer at placeres i <head>-sektionens eventhåndteringsmetoder:

Eksempel

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$("document").ready(function(){
  $("button").click(function(){
    $("p").hide();
  });
});
</script>
</head>
<body>
<h2>Dette er en overskrift</h2>
<p>Dette er en paragraf.</p>
<p>Dette er en anden paragraf.</p>
<button>Click me</button>
</body>
</html>

Prøv det selv

I det ovenstående eksempel vil en funktion blive kaldt, når knappeklikket udløses:

$("button").click(function() {  // nogle kode... } )

Denne metode skjuler alle <p>-elementer:

$("p").hide();

Funktioner i en separat fil

Hvis din hjemmeside indeholder mange sider og du ønsker, at dine jQuery-funktioner skal være lette at vedligeholde, så skal du placere dine jQuery-funktioner i en separat .js-fil.

Når vi demonstrerer jQuery i vores trin-for-trin vejledninger, tilføjer vi funktionerne direkte til <head>-sektionen. Det er dog bedre at placere dem i en separat fil, sådan som dette (citeret gennem src-attributten):

Eksempel

<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="my_jquery_functions.js"></script>
</head>

jQuery navnekonflikt

jQuery bruger $-symbolet som en introduktion til jQuery.

Funktioner i nogle andre JavaScript-biblioteker (f.eks. Prototype) bruger også $-symbolet.

jQuery bruger metoden noConflict() til at løse dette problem.

var jq=jQuery.noConflict()，hjælper dig med at bruge dine egne navne (f.eks. jq) i stedet for $-symbolet.

Prøv det selv

Konklusion

Da jQuery er designet til at håndtere HTML-begivenheder, vil din kode være mere passende og lettere at vedligeholde, hvis du følger følgende principper:

  • Placer alle jQuery-koder i begivenhedsbehandlingsfunktionerne
  • Placer alle begivenhedsbehandlingsfunktioner i dokumentets klarhedsevent处理器
  • Placer jQuery-koden i en separat .js-fil
  • Hvis der er navnekonflikter, omdøb jQuery-biblioteket

jQuery Begivenheder

Her er nogle eksempler på jQuery begivenhedsmetoder:

Event-funktioner binde funktion til
$(document).ready(function) binde funktion til dokumentets klarhedsevent (når dokumentet er færdig med at indlæse)
$(selector).click(function) udløse eller binde en funktion til klik på det valgte element
$(selector).dblclick(function) udløse eller binde en funktion til dobbeltklik på det valgte element
$(selector).focus(function) udløse eller binde en funktion til fokus på det valgte element
$(selector).mouseover(function) udløse eller binde en funktion til museoverholdelsen på det valgte element

Hvis du ønsker en fuld referencehåndbog, besøg vores jQuery begivenhedsreferencehåndbog。