การจำกัดจำนวนตัวอักษร ใน textarea ด้วย jquery

04 November 2008

Javascript Code

<script language="javascript" src="js/jquery-1.2.6.min.js"></script>
<script type="text/javascript">
$(function(){
	var max_length=15; // กำหนดจำนวนตัวอักษร
	$("#data").keyup(function(){ // เมื่อ textarea id เท่ากับ data  มี event keyup
			var this_length=max_length-$(this).val().length; // หาจำนวนตัวอักษรที่เหลือ
			if(this_length<0){
				$(this).val($(this).val().substr(0,15)); // แสดงตามจำนวนตัวอักษรที่กำหนด
			}else{
				$("#now_length").html(this_length+" ตัวอักษร"); 
              // แสดงตัวอักษรที่เหลือ			
			}			
	});
});
</script>

HTML Code

<form id="form1" name="form1" method="post" action="">
  <p>
    <textarea name="data" cols="35" rows="4" id="data"></textarea>
 <span id="now_length"></span>	
 </p>

  <p>   
    <input type="submit" name="Submit" value="Submit" />
  </p>
</form>

ตัวอย่างผลลัพธ์








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

30 Nov 10 การนำเสนอ และแสดงข้อมูล ด้วย jQuery Flexigrid Plugin เบื้องต้น อ่าน 4212 25 Sep 08 การกำหนด Selectors ด้วย jquery แบบ Basic อ่าน 4190 28 Oct 09 สร้าง Swap Banner แบนเนอร์แบบสลับอัตโนมัติ ด้วย jQuery อย่างง่าย อ่าน 4187 25 Sep 08 jquery สคริปแรกของคุณ อ่าน 4180 02 Apr 09 สร้างรายการตัวเลือกให้กับ input text ด้วย jQuery อย่างง่าย อ่าน 4087 25 Mar 10 แนะนำ การใช้งาน jQuery ร่วมกับ Google map อ่าน 4069 05 Feb 09 เพิ่มลูกเล่นการโหวด Vote หรือ Rating ด้วย jQuery และ CSS อ่าน 4054 10 Dec 09 ประยุกต์ เทคนิค jQuery เลื่อน scrollbar ขึ้นลง ตามเมาส์ สำหรับ div และ textarea อ่าน 4011 25 Sep 08 ตัวอย่างการใช้งานฟังก์ชันของ jQuery ในการเรียกใช้ Class ใน CSS อ่าน 3999 08 Feb 11 แท็บเมนู tab menu แนวตั้งอย่างง่าย ด้วย jQuery อ่าน 3988 22 Aug 09 เรียกใช้งาน jQuery ผ่าน Google API อ่าน 3889 04 Feb 09 แก้ไขข้อความแบบทันที ด้วย jQuery อ่าน 3844 25 Sep 08 Event ของ jquery แบบ Basic อ่าน 3793 25 Sep 08 การกำหนด selectors ด้วย jQuery แบบลำดับขั้น ตอนที่ 1 อ่าน 3771 25 Dec 09 สร้าง watermark ลายน้ำ ให้กับช่อง สำหรับการค้นหา ด้วย jQuery และ CSS อย่างง่าย อ่าน 3752

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

29 Dec 10 เพิ่มเติม การใช้งาน popup แบบ showModalDialog อย่างสมบูรณ์ อ่าน 4125 25 Sep 08 การกำหนด selectors ด้วย jQuery แบบตัวกรอง Attribute อ่าน 2750 14 Feb 09 คำนวณหาอายุ จากวันเกิด ด้วย php อ่าน 4559 24 Aug 10 ประยุกต์ ใช้รายการ จากฐานข้อมูล สร้างปฏิทินกิจกรรม ด้วย fullcalendar และ jQuery อ่าน 3990 25 Sep 08 Jquery javascript library มาแรง อ่าน 6384 03 Feb 10 ทบทวน javascript ฟังก์ชั่น ให้กรอกเฉพาะภาษาอังกฤษเท่านั้น อ่าน 2260 02 May 10 ใช้งาน ajax ใน jQuery ดึงข้อมูลจากฐานข้อมูลมาแสดง ใน tooltip อ่าน 5972 17 Aug 09 สร้างเมนู เทคนิค ลูกตาปลา ด้วย jQuery อย่างง่าย อ่าน 5624 11 Aug 10 ปรับแต่ง facebook comments ด้วย css กำหนด style ให้เข้ากับเว็บ อ่าน 17760 02 Jun 09 แก้ปัญหา การดึงข้อมูล จากฐานข้อมูล เมื่อเปลี่ยน charset ใน แท็ก meta อ่าน 3376 06 Jan 09 สร้างฟังก์ชัน javascript เช็ค check email อย่างง่าย อ่าน 5761 05 Oct 10 สร้าง login logout และกำหนด permission ของ facebook ด้วย php sdk อ่าน 5664 09 Oct 09 ขยายขนาดความสูงของ iframe ตามความสูงของเพจที่แสดง ด้วย jQuery อ่าน 3600 02 Nov 10 แนะนำ และการใช้งาน jQuery Colorpicker Plugin การเลือกค่าสี อ่าน 1450 16 Aug 09 เริ่มต้น jQuery UI กับการสร้าง ปฏิทินเลือกวันที่ datepicker อ่าน 17502 10 May 10 แก้ปัญหา ปุ่ม back ปุ่ม forward กับการใช้งาน ajax โหลดหน้าเพจ ด้วย jQuery plugin อย่างง่าย อ่าน 3253 13 Oct 08 คำสั่ง SQL AND OR อ่าน 3103 22 Aug 10 สร้าง waiting page ให้รอสักครู่ ก่อนลิ้งค์ ไปเว็บอื่น ด้วย jQuery และ php อ่าน 2580 28 Jun 10 การเลือก หรือ ไม่เลือก checkbox ทั้งหมด และ hilight ด้วย jQuery อย่างง่าย อ่าน 2744 08 Oct 08 คำสั่ง SQL DISTINCT อ่าน 4891
จำนวนผู้เยี่ยมชม 784665
คน 2012 © Copyright ninenik.com. All rights reserved.