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

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

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
เทคนิคการแปลภาษาผ่าน Google Docs
โดย PhoorichayaM จ 05 ต.ค. 2020 5:18 pm บอร์ด Google For Work Knowledge
0
105
จ 05 ต.ค. 2020 5:18 pm โดย PhoorichayaM
วิธีการเดินทางจาก แม่สอด มา กรุงเทพมหานคร
โดย makup จ 05 ต.ค. 2020 3:52 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
86
จ 05 ต.ค. 2020 3:52 pm โดย makup
หลักการแปลไทย-อังกฤษ/อังกฤษ-ไทย เพื่อการแปลที่มีประสิทธิภาพ
โดย PhoorichayaM จ 05 ต.ค. 2020 3:37 pm บอร์ด Microsoft Office Knowledge & line & Etc
0
52
จ 05 ต.ค. 2020 3:37 pm โดย PhoorichayaM
วิธีการเดินทางจากปากเกร็ดเข้ากทม.
โดย nalinthip จ 05 ต.ค. 2020 3:31 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
1
57
จ 05 ต.ค. 2020 3:35 pm โดย nalinthip
วิธีการเดินทางจาก อุตรดิตถ์ ไป กรุงเทพ โดยรถทัวร์
โดย PhoorichayaM จ 05 ต.ค. 2020 2:51 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
61
จ 05 ต.ค. 2020 2:51 pm โดย PhoorichayaM
วิธีการเดินทางจากปากเกร็ดไปกทม.
โดย nalinthip จ 05 ต.ค. 2020 11:45 am บอร์ด M111 - นลินทิพย์ พันชน
2
18
จ 05 ต.ค. 2020 3:14 pm โดย thatsawan
สอบถามเรื่องการออกแบบฐานข้อมูล ครับ
โดย Anonymous จ 05 ต.ค. 2020 11:44 am บอร์ด SQL - Database
2
115
จ 05 ต.ค. 2020 1:01 pm โดย บุคคลทั่วไป
Work's on hand nalinthip punchon M111
โดย nalinthip จ 05 ต.ค. 2020 11:14 am บอร์ด M111 - นลินทิพย์ พันชน
0
5
จ 05 ต.ค. 2020 11:14 am โดย nalinthip
Note
โดย nalinthip จ 05 ต.ค. 2020 11:13 am บอร์ด M111 - นลินทิพย์ พันชน
3
27
พ 07 ต.ค. 2020 7:48 pm โดย nalinthip
list ความรู้ที่มี ว่าเคยเรียน หรือ เคยทำอะไรมาบ้าง
โดย nalinthip จ 05 ต.ค. 2020 10:54 am บอร์ด M111 - นลินทิพย์ พันชน
3
35
จ 05 ต.ค. 2020 2:36 pm โดย nalinthip
งานประจำวันที่ 5 ตุลาคม 2563
โดย nalinthip จ 05 ต.ค. 2020 10:51 am บอร์ด M111 - นลินทิพย์ พันชน
1
19
จ 05 ต.ค. 2020 11:08 am โดย nalinthip
แนวทางการเขียน BPMN
โดย thatsawan อ 04 ต.ค. 2020 2:15 pm บอร์ด Microsoft Office Knowledge & line & Etc
1
87
อ 04 ต.ค. 2020 3:42 pm โดย thatsawan
สัญลักษณ์ที่ใช้ใน BPMN ใช้งานกับกรณีใดบ้างคะ
โดย thatsawan ศ 02 ต.ค. 2020 5:31 pm บอร์ด ถาม - ตอบ คอมพิวเตอร์
1
98
ศ 02 ต.ค. 2020 5:39 pm โดย thatsawan
มือถือ asus จอค้าง รีบู้ต ก็ค้าง ที่โลโก้
โดย kenpapa ส 26 ก.ย. 2020 11:11 am บอร์ด Software Review
1
233
ส 26 ก.ย. 2020 12:23 pm โดย mindphp
เจอปัญหา Forbidden You don't have permission to access /index.php on this server. Additionally, a 403 Forbidden error
โดย mindphp อ 22 ก.ย. 2020 12:58 am บอร์ด Programming - PHP
1
988
อ 22 ก.ย. 2020 7:44 pm โดย mindphp
มาแล้ว!!! MDSMS component สำหรับส่งข้อความผ่านทาง SMS บน Joomla
โดย bolue จ 21 ก.ย. 2020 5:17 pm บอร์ด MindPHP News & Feedback
0
208
จ 21 ก.ย. 2020 5:17 pm โดย bolue
สอบถามเรื่องการอ่านค่าสีสถานะของปุ่ม
โดย blebee90 จ 21 ก.ย. 2020 2:03 pm บอร์ด Programming - C/C++ & java & Python
1
188
จ 21 ก.ย. 2020 3:10 pm โดย mindphp
ต้องการกำหนดรุปแบบของช่องกรอกให้เป็นเเพทเทิร์นของเบอร์โทร เเต่ไม่ต้องการให้กรอกตัวหนังสือ
โดย thatsawan พฤ 17 ก.ย. 2020 3:18 pm บอร์ด JavaScript & Jquery Ajax
5
1399
พ 23 ก.ย. 2020 2:54 pm โดย thatsawan
สถานที่จัดงานแต่งงานชิคๆ แบบไม่ง้อโรงแรม
โดย Anonymous พฤ 17 ก.ย. 2020 2:10 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
131
พฤ 17 ก.ย. 2020 2:10 pm โดย บุคคลทั่วไป
วิธีแก้ ean13 ปัญหาที่เจอคืออะไร แก้ยังไง
โดย bolue พ 16 ก.ย. 2020 6:38 pm บอร์ด Accounting software & ERP โปรแกรมบัญชี ระบบอีอาร์พี
0
154
พ 16 ก.ย. 2020 6:38 pm โดย bolue