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

     ในการกรอกรหัสผ่าน(password) และยืนยันรหัสผ่าน(confirm password) สองช่องนี้จำเป็นต้องกรอกรหัสที่เหมือนกันเพื่อป้องกันเกิดข้อผิดพลาดและดูว่ารหัสผ่านที่ผู้ใช้กรอกเข้ามานั้นผู้ใช้จำไหมหรือแค่กรอกมั่วๆ 

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

ก่อนอื่นเราจะสร้างฟอร์มรับข้อมูลมาก่อน ซึ่งเราจะใช้ HTML ในการสร้าง ดังตัวอย่างโค้ดด้านล่างนี้

<!DOCTYPE html> 
<html> 
	<head> 
		<style> 
			.mindphp { 
				font-size:40px; 
				color:navy; 
				font-weight:bold; 
				text-align:center; 
			} 
			.todo { 
				font-size:17px; 
				text-align:center; 
				margin-bottom:20px; 
			} 
		</style> 
	</head> 
	<body> 
		<div class = "mindphp">Mindphp</div> 
		<div class = "todo">สอนเขียนโปรแกรมด้วย PHP สอน OOP ฐานข้อมูล สอน ทำเว็บ Joomla phpBB OpenERP.</div> 
		<form onSubmit = "return checkPassword(this)"> 
		<table border = 1 align = "center"> 
			<tr> 
				<!-- Enter Username -->
				<td>Username:</td> 
				<td><input type = text name = name size = 25</td> 
			</tr> 
			<tr> 
				<!-- Enter Password. -->
				<td>Password:</td> 
				<td><input type = password name = password1 size = 25</td> 
			</tr> 
			<tr> 
				<!-- To Confirm Password. -->
				<td>Confirm Password:</td> 
				<td><input type = password name = password2 size = 25></td> 
			</tr> 
			<tr> 
				<td colspan = 2 align = right> 
				<input type = submit value = "Submit"></td> 
			</tr> 
		</table> 
		</form> 
	</body> 
</html>					 

เมื่อเปิดผ่านเบราเซอร์แล้วจะมีหน้าเป็นอย่างนี้น่ะครับ

result
หน้าฟอร์มรับข้อมูลเมื่อเปิดผ่านเบราเซอร์


สำหรับการใช้ javascript ในการตรวจสอบรหัสผ่านว่าตรงกันไหม  เราสามารถศึกษาการใช้ JavaScript Functions ได้ในเว็บนี่้ 

ดูตัวอย่างโค้ดการตรวจสอบรหัสผ่านตรงไหม ด้านล่างนี้

<script> 
	// Function เพื่อตรวจสอบรหัสผ่านว่าตรงกันหรือไม่
	function checkPassword(form) { 
		password1 = form.password1.value; 
		password2 = form.password2.value; 

		// ถ้าช่่องรหัสผ่านไม่ถูกกรอก
		if (password1 == '') 
			alert ("Please enter Password"); 
					
		// ถ้าช่่องยืนยันรหัสผ่านไม่ถูกกรอก
		else if (password2 == '') 
			alert ("Please enter confirm password"); 
						
		//ถ้าทั้งสองช่องไม่ตรงกัน   ให้แจ้งผู้ใช้  และ  return false
		else if (password1 != password2) { 
			alert ("\nPassword did not match: Please try again...") 
			return false; 
			} 

		//ถ้าทั้งสองช่องตรงกัน  return true
		else{ 
			
			alert("Password Match: Welcome to Mindphp!") 
				return true; 
			} 
	} 
</script> 

เมื่อผู้ใช้กรอกรหัสผ่านทั้งสองช่องเหมือนกัน จะมี alert เพื่อแจ้งว่า รหัสผ่านไม่ตรงกัน ลองใหม่อีกครัง ดังภาพ

pass not matching
Alert ไปยังผู้ใช้ว่ารหัสผ่านไม่ตรงกัน

ถ้าหากผู้ใช้กรอกข้อมูลตรงกัน จะมี alert เพื่อแจ้งว่า สำเร็จ ดังภาพ

success
Alert รหัสผ่านตรงกัน

เราสามารถใช้เพื่อป้องกันไม่ให้ผู้ใส่ password มั่วๆ ได้รวมเราสามารถประยุกต์เพิ่มเติมเพื่อกำหนดรูปแบบรหัสผ่านว่าควรมีอะไร a-z หรือ 0-9  ไม่รับภาษาไทยเป็นต้น 

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

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
ใบเสนอราคา (Quotation) คืออะไร
โดย Phakakrong อ 07 ก.ค. 2020 4:55 pm บอร์ด Share Knowledge
0
17
อ 07 ก.ค. 2020 4:55 pm โดย Phakakrong
วิธีการเดินทางจากอำเภอเชียงคำ จ.พะเยา มา กรุงเทพมหานคร
โดย Phakakrong อ 07 ก.ค. 2020 12:03 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
29
อ 07 ก.ค. 2020 12:03 pm โดย Phakakrong
Note
โดย Phakakrong อ 07 ก.ค. 2020 11:16 am บอร์ด M105 - ผกากรอง กุสาวดี
0
3
อ 07 ก.ค. 2020 11:16 am โดย Phakakrong
list ความรู้ที่มี ว่าเคยเรียน หรือ เคยทำอะไรมาบ้าง
โดย Phakakrong อ 07 ก.ค. 2020 11:01 am บอร์ด M105 - ผกากรอง กุสาวดี
3
24
อ 07 ก.ค. 2020 3:27 pm โดย Phakakrong
ให้เขียนประวัติ และ Job description ที่เคยทำมาแต่ละบริษัท โดยระบุประเภทธุรกิจที่เคยทำมา
โดย Phakakrong อ 07 ก.ค. 2020 11:01 am บอร์ด M105 - ผกากรอง กุสาวดี
1
11
อ 07 ก.ค. 2020 2:05 pm โดย Phakakrong
Work's on Hand ผกากรอง กุสาวดี M105
โดย Phakakrong อ 07 ก.ค. 2020 11:00 am บอร์ด M105 - ผกากรอง กุสาวดี
0
6
อ 07 ก.ค. 2020 11:00 am โดย Phakakrong
งานประจำวันที่ 7 กรกฏาคม 2563
โดย Phakakrong อ 07 ก.ค. 2020 10:58 am บอร์ด M105 - ผกากรอง กุสาวดี
2
36
อ 07 ก.ค. 2020 3:43 pm โดย thatsawan
ฟอร์มรับเงิน Omise เราสามารถเปลี่ยน logo ได้มั้ยคะ
โดย thatsawan ศ 03 ก.ค. 2020 6:03 pm บอร์ด Programming - PHP
0
25
ศ 03 ก.ค. 2020 6:03 pm โดย thatsawan
input type="date" ไม่เเสดงเป็นปฎิทินวันที่ให้ใน safari แก้ไขยังไงคะ
โดย thatsawan พฤ 02 ก.ค. 2020 2:31 pm บอร์ด HTML CSS
0
48
พฤ 02 ก.ค. 2020 2:31 pm โดย thatsawan
การสร้าง bot messenger ของ facebook โดยใช้ pymessenger
โดย jirawoot พฤ 02 ก.ค. 2020 1:44 pm บอร์ด Python Knowledge
0
51
พฤ 02 ก.ค. 2020 1:44 pm โดย jirawoot
Q - ทดลองทำเอกสารยื่นแบบผ่านเน็ตแล้ว ไฟล์ txt ใช้ไม่ได้
โดย natthanit.r2538 พ 01 ก.ค. 2020 4:59 pm บอร์ด Accounting software & ERP โปรแกรมบัญชี ระบบอีอาร์พี
3
62
พ 01 ก.ค. 2020 5:41 pm โดย natthanit.r2538
สรุปการยื่นแบบภาษีออนไลน์
โดย natthanit.r2538 อ 30 มิ.ย. 2020 5:32 pm บอร์ด Accounting software & ERP โปรแกรมบัญชี ระบบอีอาร์พี
1
63
อ 30 มิ.ย. 2020 7:18 pm โดย natthanit.r2538
หลักการคิดค่าคอมมิชชั่น และวิธีการคิด รายได้จาก Commission
โดย natthanit.r2538 อ 30 มิ.ย. 2020 11:31 am บอร์ด Accounting software & ERP โปรแกรมบัญชี ระบบอีอาร์พี
0
55
อ 30 มิ.ย. 2020 11:31 am โดย natthanit.r2538
MJUpgrade อัพเกรดไม่สำเร็จ Error: zip file not found
โดย chaiyaphat ศ 26 มิ.ย. 2020 11:01 am บอร์ด Joomla Development
3
512
ศ 26 มิ.ย. 2020 1:24 pm โดย mindphp
ตั้งค่าใช้ Email ใน phpbb เเล้ว ไม่ทำงาน
โดย thatsawan พฤ 25 มิ.ย. 2020 5:37 pm บอร์ด ปัญหาการใช้ phpBB3, SMF, Joomla, Wordpress, CMS, CRM
5
105
ส 27 มิ.ย. 2020 4:43 pm โดย thatsawan
เจอปัญหาตอนทำรายการ Omise เป็นบางครั้ง Error Uncaught OmiseInvalidChargeException
โดย thatsawan พฤ 25 มิ.ย. 2020 3:56 pm บอร์ด Programming - PHP
2
80
จ 29 มิ.ย. 2020 5:29 pm โดย thatsawan
ต้องการจะสร้างไฟล์ HTML เเต่นำค่า php ไป HTML โดย Twig เขียนใน phpbb จะทำยังไงคะ
โดย thatsawan พ 24 มิ.ย. 2020 5:45 pm บอร์ด Programming - PHP
3
83
พฤ 25 มิ.ย. 2020 3:49 pm โดย Sirayu
ถ้าเราต้องการแสดงค่าตอน onchange ใน option ที่มี value มากกว่า 1
โดย thatsawan อ 23 มิ.ย. 2020 12:51 pm บอร์ด JavaScript & Jquery Ajax
2
134
อ 23 มิ.ย. 2020 3:01 pm โดย thatsawan
4 จุดเช็คอิน เกาะล้าน ยอดฮิต
โดย A2d จ 22 มิ.ย. 2020 10:44 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
2
85
ส 27 มิ.ย. 2020 12:01 am โดย A2d
ต้องการจะเปลี่ยนคำปุ่ม omise จาก Pay with Omise เป็นคำที่เรากำหนดขึ้นเอง
โดย thatsawan จ 22 มิ.ย. 2020 5:18 pm บอร์ด PHP Knowledge
2
110
จ 22 มิ.ย. 2020 5:39 pm โดย thatsawan