Now hair microblogging, that text box can only input 200 words as if, more will automatically delete, or the word is limited, with JS can realize this function. Today brought to this JS limit the number of text boxes in the form of examples, I believe there is a good reference to this aspect. For ease of use, the code is split into HTML form sections and JavaScript code sections:
HTML Form section, the code is as follows:
| The code is as follows |
Copy Code |
<form name=myform action= "" >
<textarea name= "message" wrap= "physical" cols= "rows=" 4 "onkeydown=" Textcounter (This.form.message, this.form.remlen,125); "onkeyup=" Textcounter (this.form.message,this.form.remlen,125); " ></textarea>
<br>
You can also enter <input readonly type= "text" name= "Remlen" size= "4" maxlength= "3" value= "" > Characters </div>
</form> |
JavaScript code section:
| The code is as follows |
Copy Code |
<script language= "JavaScript" >
function textcounter (field, Countfield, Maxlimit) {
Defines the function, passing in 3 parameters, namely the name of the form, the form field element name, the character limit
if (Field.value.length > Maxlimit)
If the number of characters in the element area is greater than the maximum number of characters, truncate
Field.value = field.value.substring (0, Maxlimit);
Else
Display the number of remaining characters that can be entered in a form page text box
Countfield.value = Maxlimit-field.value.length;
}
</SCRIPT> |
Note: Two pieces of code can be copied to the same page.
Look at one more example
| The code is as follows |
Copy Code |
| <script language= "JavaScript" >
<!--
function Checktext (text)
{
Allvalid = true;
for (i = 0; i < text.length; i++)
{
if (Text.charat (i)!= "")
{
Allvalid = false;
Break
}
}
return allvalid;
} function Gbcount (message,total,used,remain)
{
var Max;
max = Total.value;
if (Message.value.length > Max) {
Message.value = message.value.substring (0,max);
Used.value = max;
Remain.value = 0;
Alert ("Message not more than 200 words!");
}
else {
Used.value = Message.value.length;
Remain.value = Max-used.value;
}
} -->
</script> <style type= "Text/css"
<!--
* {padding:0; margin:0;}
Body, html {text-align:left; font-size:12px; line-height:150%; margin:0 auto ; background: #fff; padding-top:20px;}
Fieldset {padding:10px; width:550px; margin:0 auto;}
Legend {font-size:14px; font-weight:bold;}
. Inputtext {border:none; background: #fff;}
;
</style> <form action= "savedata.asp" method= "post" onsubmit= "Return datacheck ();"
<fieldset><legend> Please enter the content </legend>
<textarea name= "Memo" rows= "10" wrap=physical cols= " onkeydown=" Gbcount (this.form.memo,this.form.total,this.form.used, This.form.remain); " onkeyup= "Gbcount (This.form.memo,this.form.total,this.form.used,this.form.remain);" ></textarea>
<p> Maximum words:
<input disabled maxlength= "4" name= "Total" Size= "3" value= "" " class=" Inputtext "
has been used in words:
<input disabled maxlength=" 4 " name= "used" size= "3" value= "0" class= "inputtext" "
Remaining words:
<input disabled maxlength= "4" name= "Remain" size= "3" value= "" class= "Inputtext" ></td>
</p>
</fieldset>
</form> |
In fact, this principle is very simple we only add a onkeyup event in the input, when the user pressed the space automatically judge the character is not more than the specified length and then judged Oh.
