Friday, March 6, 2015

ใช้งาน jQuery จาก jade tamplate

jQuery เป็น Library ของ JavaScript เป็นตัวช่วยทำให้รูปแบบของเว็บเพจสวยงามขึ้น โดยปกติแล้วการสั่งให้หน้าเว็บแสดงผลอย่างสวยงามหรือมีลูกเล่นต่างๆ นั้นต้องเขียนคำสั่ง เขียนฟังค์ชันเป็นจำนวนมาก แต่ด้วยหลักการ OOP ทำให้สามารถนำเอาฟังค์ชันต่างๆ มาใช้งานซ้ำได้อย่างมีประสิทธิภาพ

การเขียน template ผ่าน jade นั้นก็สามารถแทรก jQuery เข้าไปได้ ตามตัวอย่างนี้

html
head
  script(src="/javascripts/jquery-1.8.2.js")
  script
    $("#rollButton").click(function() {
       alert("sas");
    });
body
  input#rollButton(type="button", value="Roll")

แต่ถ้าต้องการเรียก script จากเว็บเลยก็เปลี่ยนเป็น

script(src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js")

แค่นี้แหละครับ ส่วนรายละเอียดปลีกย่อยอื่นๆ สามารถศึกษาจากเว็บไซต์ทั่วไปได้

---------

ที่มา:
http://stackoverflow.com/questions/12665666/jade-button-and-jquery-click-event

No comments:

Post a Comment