ดาวไม่ได้ใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งาน
 

การสร้างเว็บไซต์หรือออกแบบเว็บไซต์ นอกจากจะต้องมีความสวยงามและมีการจัดวางองค์ประกอบทที่เหมาะสม สิ่งหนึ่งที่ขาดไม่ได้คือการเพิ่มลูกเล่นแปลกๆและน่าสนใจ เพื่อสร้างประสบการณ์ดีๆให้กับผู้ใช้  ซึ่งการสร้างลูกเล่นต่างๆโดยส่วนใหญ่เราสามารถใช้  JavaScript หรือ CSS  ซึ่งบทความนี้เราจะพูดถึง method change() 

change()  เป็นเมธอดที่ inbuilt ใน jQuery  ซึ่งใช้ในการเปลี่ยนค่าของช่องใส่ วิธีนี้ใช้ได้กับองค์ประกอบ“ input, textarea และ select” เท่านั้น

รูปแบบ Syntax 

$(selector).change(function)
  • พารามิเตอร์ :  มันยอมรับพารามิเตอร์“ ฟังก์ชั่น” ที่เป็นตัวเลือก 
  • Return Value : มันคืนองค์ประกอบพร้อมการดัดแปลง 

ตัวอย่างโค้ดการใช้ฟังก์ชัน  change

<html> 

<head> 
	<script src="https://ajax.googleapis.com/ajax/libs/ 
			jquery/3.3.1/jquery.min.js"></script> 
	<!--Demo of change method without passing function-->
	<script> 
		$(document).ready(function() { 
			$("button").click(function() { 
				$("input").change(); 
			}); 
		}); 
	</script> 
</head> 

<body> 
	<p>Click the button to see the changed value !!!</p> 
	<!--click on this button and see the change -->
	<button>Click Me!</button> 
	<p>Enter value: 
		<input value="Donald" onchange="alert(this.value)"
		type="text"></p> 
</body> 

</html> 

 ผลลัพธ์ที่ได้เมื่อเปิดกับเบราเซอร์

before clicking
ผลลัพธ์ก่อนกดปุ่ม

ผลลัพธ์เมื่อกดปุ่ม “Click Me”

 

After clicking the “Click Me” button-
ผลลัพธ์เมื่อกดปุ่ม “Click Me”

 

 ผลลัพธ์ที่คือจะ Alert ปรากฎขึ้นมา เมื่อมีการกดปุ่ม ซึ่งข้อมูลที่จะ  alert นั้นเป็นข้อมูลที่ได้มาจาก input box นั้นเอง เพราะว่าได้เขียนฟังก์ชันไว้ว่าเมื่อมีการคลิก ให้แสดง alert โดยใช้ข้อความจาก input ผ่านเมธอด change นั้นเอง

ช่องทางการศึกษาเพิ่มเติมข่าวที่น่าสนใจเกี่ยวกับ : Jquery

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
os.mkdir ฟังก์ชั่นสำหรับการสร้าง folder ใหม่
โดย benzas00123 ศ 24 ม.ค. 2020 6:44 pm บอร์ด Python Knowledge
0
2
ศ 24 ม.ค. 2020 6:44 pm โดย benzas00123
upload รูปภาพหลายๆรูป ด้วย Flask
โดย benzas00123 ศ 24 ม.ค. 2020 6:31 pm บอร์ด Python Knowledge
0
4
ศ 24 ม.ค. 2020 6:31 pm โดย benzas00123
มาแล้ว MDPartner Component สำหรับจัดเก็บข้อมูลลูกค้าในระบบ CRM
โดย prmindphp ศ 24 ม.ค. 2020 6:02 pm บอร์ด MindPHP News & Feedback
0
17
ศ 24 ม.ค. 2020 6:02 pm โดย prmindphp
os.remove ฟังก์ชั่นสำหรับการลบไฟล์
โดย benzas00123 ศ 24 ม.ค. 2020 5:35 pm บอร์ด Python Knowledge
0
5
ศ 24 ม.ค. 2020 5:35 pm โดย benzas00123
ขอสอบถามวิธีการดึงข้อมูลมาลงใน table ที่เราต้องการหน่อยครับ
โดย benzas00123 ศ 24 ม.ค. 2020 2:06 pm บอร์ด Programming - C/C++ & java & Python
1
13
ศ 24 ม.ค. 2020 2:14 pm โดย benzas00123
ลูกไม่รักดี?
โดย noppadonsk ศ 24 ม.ค. 2020 10:40 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
12
ศ 24 ม.ค. 2020 10:40 am โดย noppadonsk
วิธีการแปลง timestamp เพื่อหาจำนวนวันที่ผ่านมาหรือคงเหลือ
โดย Ittichai_chupol พ 22 ม.ค. 2020 6:37 pm บอร์ด PHP Knowledge
0
38
พ 22 ม.ค. 2020 6:37 pm โดย Ittichai_chupol
วิธีการตรวจสอบว่ารูปเป็นแนวตั้งหรือแนวนอน ด้วยภาษา php
โดย jamepiyawat พ 22 ม.ค. 2020 6:16 pm บอร์ด PHP Knowledge
0
19
พ 22 ม.ค. 2020 6:16 pm โดย jamepiyawat
Range Sliders เก็บค่าตัวเลขด้วย range sliders
โดย benzas00123 พ 22 ม.ค. 2020 5:50 pm บอร์ด Booststap Knowledge
1
64
ศ 24 ม.ค. 2020 9:32 am โดย LEG
อยากทราบวิธีการตรวจสอบว่าจะมีเวลาอีกกี่วันถึงจะ ถึงเลข timestamp ที่กำหนด
โดย Ittichai_chupol พ 22 ม.ค. 2020 3:54 pm บอร์ด Programming - PHP
1
81
พ 22 ม.ค. 2020 4:18 pm โดย thatsawan
ขอสอบถามวิธีการเขียน bootstrap 3 ในการสร้าง bar ครับ
โดย benzas00123 พ 22 ม.ค. 2020 3:13 pm บอร์ด HTML CSS
5
120
พ 22 ม.ค. 2020 3:32 pm โดย benzas00123
วันหยุดที่หายไป
โดย noppadonsk พ 22 ม.ค. 2020 11:42 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
32
พ 22 ม.ค. 2020 11:42 am โดย noppadonsk
วิธีการปรับการการแสดงการ รายชื่อของแจ้งเตือน bookmark โดย phpbb
โดย Ittichai_chupol อ 21 ม.ค. 2020 5:45 pm บอร์ด PHP Knowledge
0
25
อ 21 ม.ค. 2020 5:45 pm โดย Ittichai_chupol
pillow vs wand library ความแตกต่างของ library ทั้ง 2 ตัวในการ procress รูปภาพ
โดย benzas00123 อ 21 ม.ค. 2020 5:29 pm บอร์ด Python Knowledge
1
24
อ 21 ม.ค. 2020 5:54 pm โดย mindphp
อยู่ดีๆ ก็ไม่สามารถเชื่อมต่อกับ database ได้ครับ
โดย benzas00123 อ 21 ม.ค. 2020 4:46 pm บอร์ด Programming - C/C++ & java & Python
5
67
อ 21 ม.ค. 2020 5:39 pm โดย benzas00123
ขอถามเกี่ยวกับ library ImageMagick ครับ
โดย benzas00123 อ 21 ม.ค. 2020 3:29 pm บอร์ด Programming - C/C++ & java & Python
2
31
อ 21 ม.ค. 2020 4:23 pm โดย benzas00123
Git Lad จะทำอย่างไรให้ไฟล์ที่อยู่ในโฟร์ย่อย ออกมาครับ
โดย jamepiyawat อ 21 ม.ค. 2020 12:08 pm บอร์ด ถาม - ตอบ คอมพิวเตอร์
2
148
อ 21 ม.ค. 2020 2:04 pm โดย jamepiyawat
ขอทราบวิธีการเขียน python เก็บข้อมูล ip ของผู้ใช้หน่อยครับ
โดย benzas00123 อ 21 ม.ค. 2020 10:54 am บอร์ด Programming - C/C++ & java & Python
1
111
อ 21 ม.ค. 2020 12:20 pm โดย mindphp
ขอสอบถามเกี่ยวกับการอัพโหลดรูปภาพเข้า ฐานข้อมูลครับ
โดย benzas00123 จ 20 ม.ค. 2020 6:29 pm บอร์ด SQL - Database
3
88
อ 21 ม.ค. 2020 2:00 pm โดย mindphp
โปรแกรมแปลงหน่วย เครื่องมือในการแปลงหน่วยความจุคอมพิวเตอร์
โดย prmindphp จ 20 ม.ค. 2020 6:24 pm บอร์ด MindPHP News & Feedback
0
68
จ 20 ม.ค. 2020 6:24 pm โดย prmindphp