การสร้างเว็บไซต์หรือออกแบบเว็บไซต์ นอกจากจะต้องมีความสวยงามและมีการจัดวางองค์ประกอบทที่เหมาะสม สิ่งหนึ่งที่ขาดไม่ได้คือการเพิ่มลูกเล่นแปลกๆและน่าสนใจ เพื่อสร้างประสบการณ์ดีๆให้กับผู้ใช้ ซึ่งการสร้างลูกเล่นต่างๆโดยส่วนใหญ่เราสามารถใช้ JavaScript หรือ CSS ซึ่งบทความนี้เราจะพูดถึง method keyup()
keyup ()เป็น method ใน JQuery ที่ใช้ในการเรียกเหตุการณ์(event) เมื่อผู้ใช้ได้กดปุ่มจากแป้นพิมพ์ ดังนั้นการใช้ keyup () เป็นวิธีการที่เราสามารถตรวจสอบว่ามีการกดหรือปล่อยปุ่มใด ๆ จากแป้นพิมพ์
ซึ่งมีรูปแบบ syntex ดังนี้
$(selector).keyup(function) ตัวอย่างง่ายๆการใช้เมธฮอด keyup()
<html>
<head>
<title>Jquery | Keyup() </title>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js">
</script>
</head>
<script>
$(document).keyup(function(event) {
alert('You released a key');
});
</script>
<body>
<br>
<br>
<center>
<h1>Press and release a key from the keyboard </h1>
</center>
</body>
</html>
จากโค้ด ตรง Jquery ได้ใช้ เมธอด keyup และให้มีการ Alert ซึ่งในที่นี้ก็คือ เมื่อผู้ใช้กดปุ่มใดๆบนคีย์บอร์ดและเมื่อปล่อยปุ่ม ให้ alert ข้อความ You released a key
เราสามารถนำ method keyup ไปใช้ในการตรวจสอบ password และ confirm password ว่าตรงกันหรือไม่ในรูปแบบ realtime คือ เมื่อผู้ใช้กรอก confirm password ทีละตัวก็สามารถตรวจทีละตัวได้ เป็นต้น
ช่องทางการศึกษาเพิ่มเติมข่าวที่น่าสนใจเกี่ยวกับ : Jquery
- ถาม-ตอบ Jquery/Javascript(195)
- ศึกษาความรู้เกี่ยวกับ Jquery(119)
- บทเรียน Jquery(144)
- บทเรียน HTML(243)
- ศึกษาความรู้เกี่ยวกับ PHP(434)
