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

การสร้างเว็บไซต์หรือออกแบบเว็บไซต์ นอกจากจะต้องมีความสวยงามและมีการจัดวางองค์ประกอบทที่เหมาะสม สิ่งหนึ่งที่ขาดไม่ได้คือการเพิ่มลูกเล่นแปลกๆและน่าสนใจ เพื่อสร้างประสบการณ์ดีๆให้กับผู้ใช้  ซึ่งการสร้างลูกเล่นต่างๆโดยส่วนใหญ่เราสามารถใช้  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

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
รวมเว็บไซต์เช็คDNS และวิธีเช็คDNS คำสั่ง nslookup ,IP domainname
โดย aninthana พฤ 22 ส.ค. 2019 5:45 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
12
พฤ 22 ส.ค. 2019 5:45 pm โดย aninthana
หลักสำคัญในการร่างสัญญา
โดย EyePornnipa พฤ 22 ส.ค. 2019 5:33 pm บอร์ด M089 - นางสาวพรนิภา ราชธานี
0
12
พฤ 22 ส.ค. 2019 5:33 pm โดย EyePornnipa
เที่ยว & กินไม่หยุด...ที่ตลาดวังหลัง จ.กรุงเทพมหานคร ฯ
โดย Patipat พฤ 22 ส.ค. 2019 5:05 pm บอร์ด M088 - ปฏิภัทร สารธรรม
0
5
พฤ 22 ส.ค. 2019 5:05 pm โดย Patipat
ถามเกี่ยวกับ Python GUI ( Tkinter )
โดย New Pimsean พฤ 22 ส.ค. 2019 4:33 pm บอร์ด Programming - C/C++ & java & Python
0
3
พฤ 22 ส.ค. 2019 4:33 pm โดย New Pimsean
ถ้าต้องการจดโดเมนเนม ต้องทำอย่างไร
โดย aninthana พฤ 22 ส.ค. 2019 3:20 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
1
17
พฤ 22 ส.ค. 2019 4:32 pm โดย thorng1
วิธีการทำเว็บไซต์ 2 ภาษา ในภาษา python
โดย jirawoot พฤ 22 ส.ค. 2019 3:20 pm บอร์ด Python Knowledge
0
3
พฤ 22 ส.ค. 2019 3:20 pm โดย jirawoot
จ่ายหนี้..น้อยลง!! ธนาคารพาณิชย์ ประกาศลดดอกเบี้ยเงินกู้
โดย promotion พฤ 22 ส.ค. 2019 3:17 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
6
พฤ 22 ส.ค. 2019 3:17 pm โดย promotion
Q - อยากทราบวิธีแก้หน้า Lost password ครับ
โดย jamepiyawat พฤ 22 ส.ค. 2019 11:24 am บอร์ด Joomla Development
8
48
พฤ 22 ส.ค. 2019 4:30 pm โดย thorng1
ขั้นตอนใดในกระบวนการสร้างต้นแบบที่จะทำให้ต้นแบบเกิดความสมบูรณ์เเละพร้อมนำไปใช้งานมากที่สุด เพราะเหตุใด
โดย Anonymous พฤ 22 ส.ค. 2019 1:19 pm บอร์ด ถาม - ตอบ คอมพิวเตอร์
0
6
พฤ 22 ส.ค. 2019 1:19 pm โดย บุคคลทั่วไป
R - ต้องการเพิ่มการแสดงรายการบนใบแจ้งหนี้
โดย EyePornnipa พฤ 22 ส.ค. 2019 12:43 pm บอร์ด M.D.Soft Co.,Ltd. - Tester
0
3
พฤ 22 ส.ค. 2019 12:43 pm โดย EyePornnipa
เขียนวิธีการเดินจากบ้านมา กทม จากคลอง 3 หมู่บ้านพฤกษา 13 มา เสนานิคม
โดย aninthana พฤ 22 ส.ค. 2019 12:21 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
1
17
พฤ 22 ส.ค. 2019 2:25 pm โดย mindphp
note
โดย aninthana พฤ 22 ส.ค. 2019 11:10 am บอร์ด M092 - อนินธนา บุญยัง
1
7
พฤ 22 ส.ค. 2019 6:38 pm โดย aninthana
Work's on Hand อนินธนา บุญยัง M092
โดย aninthana พฤ 22 ส.ค. 2019 11:10 am บอร์ด M092 - อนินธนา บุญยัง
1
12
พฤ 22 ส.ค. 2019 6:34 pm โดย aninthana
Job description ที่เคยทำมาแต่ละบริษัท โดยระบุประเภทธุรกิจทำมา
โดย aninthana พฤ 22 ส.ค. 2019 11:08 am บอร์ด M092 - อนินธนา บุญยัง
1
16
พฤ 22 ส.ค. 2019 11:37 am โดย aninthana
งานประจำวันที่ 22 สิงหาคม 2562
โดย aninthana พฤ 22 ส.ค. 2019 11:04 am บอร์ด M092 - อนินธนา บุญยัง
1
18
พฤ 22 ส.ค. 2019 11:06 am โดย aninthana
งานประจำวันที่ 22 สิงหาคม 2562
โดย jirawoot พฤ 22 ส.ค. 2019 10:23 am บอร์ด M090 - นายจิระวุฒิ อัครลิขิตกุล
0
3
พฤ 22 ส.ค. 2019 10:23 am โดย jirawoot
งานประจำวันที่ 22 สิงหาคม 2562
โดย chatee supasand พฤ 22 ส.ค. 2019 10:10 am บอร์ด MT33 - นายชาตรี สุภาแสน
0
1
พฤ 22 ส.ค. 2019 10:10 am โดย chatee supasand
งานประจำวันที่ 22 สิงหาคม 2562
โดย Patipat พฤ 22 ส.ค. 2019 10:07 am บอร์ด M088 - ปฏิภัทร สารธรรม
0
3
พฤ 22 ส.ค. 2019 10:07 am โดย Patipat
งานประจำวันที่ 22 กรกฎาคม 2562
โดย jamepiyawat พฤ 22 ส.ค. 2019 10:01 am บอร์ด M084 - นายปิยวัช เชาว์วิมล
0
2
พฤ 22 ส.ค. 2019 10:01 am โดย jamepiyawat
งานประจำวันที่ 22 สิงหาคม 2562
โดย EyePornnipa พฤ 22 ส.ค. 2019 9:40 am บอร์ด M089 - นางสาวพรนิภา ราชธานี
0
6
พฤ 22 ส.ค. 2019 9:40 am โดย EyePornnipa