กำหนด ปุ่ม ให้ทำงาน เมื่อคลิกที่ checkbox ยอมรับเงื่อนไข ด้วย jQuery

21 December 2010

ตัวอย่างต่อไปนี้ ใช้สำหรับใช้งานการกำหนดให้ ปุ่มสามารถใช้งานได้
เมื่อคลิกที่ checkbox เพื่อยอมรับเงื่อนไข เหมาะใช้สำหรับแสดงในหน้าอ่านข้อตกลง หรือว่า
นโยบายของเว็บไซต์ ก่อนทำการ ดำเนินการต่อไปยังหน้าถัดไป

ตัวอย่าง

ยอมรับเงื่อนไข


โค้ดตัวอย่าง

<form id="form1" name="form1" method="post" action="">
<input type="checkbox" name="i_accept" id="i_accept" />
ยอมรับเงื่อนไข 
<br />
<br />
<input type="submit" name="continue_bt" id="continue_bt" value="ดำเนินการต่อ" disabled="disabled" />
</form>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
$(function(){
	 $("#i_accept").click(function(){ // เมื่อคลิกที่ checkbox id=i_accept
		 if($(this).attr("checked")=="checked"){ // ถ้าเลือก
			 $("#continue_bt").removeAttr("disabled"); // ให้ปุ่ม id=continue_bt ทำงาน สามารถคลิกได้
		 }else{ // ยกเลิกไม่ทำการเลือก
			 $("#continue_bt").attr("disabled","disabled");  // ให้ปุ่ม id=continue_bt ไม่ทำงาน
		 }
	 });
});
</script>

 



ตัวอย่างนี้ใช้งานกับ jQuery เวอร์ชั่น 1.7.1 เป็นต้นไป อาจจะต้องประยุกต์เพิ่มเติมหากใช้กับเวอร์ชั่นเก่าๆ





บทความในหมวดที่่น่าสนใจ อื่นๆ jQuery Learning

05 Apr 10 กำหนด link ลิ้งค์ ทั้งหมด ให้ เปิดหน้าต่างใหม่ ด้วย jQuery อย่างง่าย อ่าน 2654 27 May 10 ทบทวน ลำดับ การทำงาน mouse events ใน jQuery อ่าน 2643 20 Mar 11 กำหนด รายละเอียด การใช้งาน facebook login button เพิ่มเติม อ่าน 2602 19 Mar 11 การสร้างปุ่ม ล็อกอิน เว็บไซต์ แบบไม่แสดงรูป ด้วย facebook อ่าน 2589 13 Oct 10 สร้างเส้นทาง จากการ คลิกกำหนด waypoints จุดผ่านเส้นทาง ใน google map อ่าน 2554 23 Mar 11 เทคนิค หน่วงเวลา กับ event keyup ด้วย jQuery อ่าน 2535 18 Oct 10 แนะนำ jwplayer สำหรับ แสดง video ในเว็บ และ jquery jwplayer อ่าน 2509 26 Oct 10 แนะนำ autocomplete ใน jQuery ui กับการประยุกต์ใช้งาน อ่าน 2502 27 Jan 10 การใช้งาน jQuery.contains() ใน jQuery 1.4 อ่าน 2462 11 Sep 10 กำหนด แก้ไข เปลี่ยนแปลง รูปแบบ ประเภท ของ แผนที่ map types ใน google map อ่าน 2435 13 Sep 10 ประยุกต์ สร้างเครื่องมือ ค้นหา พิกัด จากชื่อสถานที่ จำนวนมาก ใน google map อ่าน 2370 26 Jan 10 การใช้งาน method .clearQueue() ใน jQuery 1.4 javascript library เวอร์ชั่นล่าสุด อ่าน 2366 18 Mar 09 สร้างเครื่องคิดเลขอย่างง่ายด้วย CSS และ jQuery อ่าน 2307 22 Mar 11 การกำหนด แท็ก html ในตัวแปร JavaScript อย่างง่าย อ่าน 2278 28 Dec 10 ทบทวน ลำดับ การทำงาน keyboard events ของ input text ใน jQuery อ่าน 2202

บทความคนเข้าอ่านวันนี้

17 Feb 12 ประยุกต์ ใช้งาน jquery ui autocomplete ร่วมกับฐานข้อมูล อย่างง่าย อ่าน 3274 14 Mar 09 ค้นหาข้อความในหน้าเว็บเพจอย่างง่ายด้วย jQuery อ่าน 2941 12 Nov 09 รู้จักกับ Ajax Events ใน jQuery อ่าน 4771 25 Sep 08 การกำหนด selectors ด้วย jQuery แบบลำดับขั้น ตอนที่ 1 อ่าน 4087 13 Oct 10 สร้างเส้นทาง จากการ คลิกกำหนด waypoints จุดผ่านเส้นทาง ใน google map อ่าน 2554 13 Oct 08 คำสั่ง SQL AND OR อ่าน 3448 20 Aug 09 jQuery ป้องกัน การคลิกขวา ในหน้าเว็บไซต์ อ่าน 3045 25 Sep 08 แสดง Code สวยๆ Style Google ด้วยเครื่องมือที่เรียกว่า SyntaxHighlighter อ่าน 6157 28 Oct 08 ดึงข้อมูลจาก text ไฟล์มาแสดงด้วย ajax อ่าน 5918 25 Sep 08 ใช้ PHP สร้าง Javascript อย่างง่าย อ่าน 4725 19 Jun 10 สร้าง comment ด้วย social plugins ใน facebook api อย่างง่ายดาย อ่าน 20166 14 Nov 08 สร้างป้ายโฆษณาเลื่อนตามจอภาพ ด้วย jquery ได้ในไม่กี่บรรทัด อ่าน 7931 04 Nov 09 ประยุกต์สร้าง pdf ไฟล์ จาก tcpdf class ด้วย php รองรับภาษาไทย อ่าน 6909 25 Sep 08 การกำหนดความกว้างความสูงของ element ด้วยฟังก์ชันของ jQuery อ่าน 2726 11 Feb 11 แนะนำ การใช้งาน jQuery quicksearch plugin อ่าน 3861 07 Jul 10 เทคนิค php ดึงข้อมูล comment จาก facebook มาใช้งาน อ่าน 6408 22 Nov 08 ซ่อนและแสดงเนื้อหาแบบหีบเพลง (accordion) ด้วย jquery อย่างง่าย อ่าน 5297 03 Nov 08 เก็บ HTML ไว้ในตัวแปร PHP อย่างง่ายด้วยฟังก์ชัน ob_start() อ่าน 3386 25 Sep 08 ปิดหน้า Browser โดยไม่ต้องมีข้อความยืนยัน อ่าน 4020 26 Oct 08 เช็ค browser ด้วย javascript ได้ทั้ง IE Firefox Opera Chrome อ่าน 5156
จำนวนผู้เยี่ยมชม 892670
คน 2012 © Copyright ninenik.com. All rights reserved.