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

เขียนเมื่อ 11 ปีก่อน โดย Ninenik Narkdee
textarea จำกัด jquery

คำสั่ง การ กำหนด รูปแบบ ตัวอย่าง เทคนิค ลูกเล่น การประยุกต์ การใช้งาน เกี่ยวกับ textarea จำกัด jquery



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>

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



กด Like หรือ Share เป็นกำลังใจ ให้มีบทความใหม่ๆ เรื่อยๆ น่ะครับ











URL สำหรับอ้างอิง











เว็บไซต์ของเราให้บริการเนื้อหาบทความสำหรับนักพัฒนา โดยพึ่งพารายได้เล็กน้อยจากการแสดงโฆษณา โปรดสนับสนุนเว็บไซต์ของเราด้วยการปิดการใช้งานตัวปิดกั้นโฆษณา (Disable Ads Blocker) ขอบคุณครับ