Peristiwa jQuery

jQuery adalah disediakan khusus untuk penggunaan peristiwa.

Fungsi peristiwa jQuery

Method peristiwa adalah fungsi yang utama dalam jQuery.

Program peristiwa adalah method yang dipanggil ketika terjadi beberapa peristiwa di HTML. Istilah 'dipicu' (atau 'diaktifkan') sering kali digunakan.

biasanya kod jQuery akan diletakkan di dalam method penanganan peristiwa di bagian <head>.

ตัวอย่าง

<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>This is a heading</h2>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<button>Click me</button>
</body>
</html>

ลองทดลองด้วยตัวเอง

Dalam contoh di atas, fungsi akan dipanggil ketika peristiwa klik tombol diaktifkan:

$("button").click(function() {  // some code... } )

Metoden ini menyembunyikan semua elemen <p>:

$("p").hide();

Fungsi dalam fail yang terpisah

Jika laman web anda mengandungi banyak halaman dan anda mahu fungsi jQuery anda mudah untuk diurus, sila letakkan fungsi jQuery anda di fail .js yang berasingan.

เมื่อเราแสดงตัวอย่าง jQuery ในโครงงานของเรา เราจะเพิ่มฟังชันตรงไปยังส่วน <head> อย่างไรก็ตาม การจัดเก็บในไฟล์แยกตัวจะดีขึ้น เช่นนี้ (ด้วยการอ้างอิงไฟล์ผ่านทาง src):

ตัวอย่าง

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

ชนชื่อ jQuery

jQuery ใช้สัญญาณ $ ว่าเป็นวิธีนำเสนอ jQuery

ฟังชันของบางหน่วยงานอื่นของ JavaScript (เช่น Prototype) ก็ใช้สัญญาณ $

jQuery ใช้วิธี noConflict() ที่ชื่อนี้เพื่อแก้ปัญหานี้

var jq=jQuery.noConflict()،ช่วยเหลือคุณในการใช้ชื่อตัวเอง (เช่น jq) แทนสัญญาณ $

ลองทดลองด้วยตัวเอง

สรุป

เนื่องจาก jQuery ถูกออกแบบมาเพื่อการจัดการเหตุการณ์ HTML ดังนั้น เมื่อคุณปฏิบัติตามหลักต่อไปนี้ รหัสของคุณจะมีความเหมาะสมและง่ายต่อการดูแล:

  • จัดเก็บทุกรหัส jQuery ในฟังชันการจัดการเหตุการณ์
  • จัดเก็บทุกฟังชันการจัดการเหตุการณ์ในตัวแปลงเมื่อเอกสารเตรียมพร้อม
  • จัดเก็บรหัส jQuery ในไฟล์ .js แยกตัว
  • ถ้ามีชื่อที่ชนกัน จะเรียกชื่อฐาน jQuery ใหม่

Peristiwa jQuery

นี่คือตัวอย่างของฟังชันเหตุการณ์ใน jQuery

ฟังชัน Event ผูกฟังชันไปยัง
$(document).ready(function) ผูกฟังชันไปยังเหตุการณ์เมื่อเอกสารเตรียมพร้อม (เมื่อเอกสารเสร็จการโหลด)
$(selector).click(function) กระตุ้นหรือผูกฟังชันไปยังเหตุการณ์คลิกขององค์ประกอบที่ถูกเลือก
$(selector).dblclick(function) กระตุ้นหรือผูกฟังชันไปยังเหตุการณ์คลิกทวนขององค์ประกอบที่ถูกเลือก
$(selector).focus(function) กระตุ้นหรือผูกฟังชันไปยังเหตุการณ์ได้ความสนใจขององค์ประกอบที่ถูกเลือก
$(selector).mouseover(function) กระตุ้นหรือผูกฟังชันไปยังเหตุการณ์หลอดเท้าขององค์ประกอบที่ถูกเลือก

ถ้าคุณต้องการคู่มือการใช้งานที่สมบูรณ์ โปรดเข้าถึง คู่มือการใช้งานเหตุการณ์ jQuery。