<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>文本框输入字数统计示例</title>
</head>
<style type="text/css">
body{
font-size:12px;}
</style>
<script language="JavaScript">
<!--
function gbcount(){
var max=50;
var content = document.getElementById("content");
var used = document.getElementById("used");
var remain = document.getElementById("remain");
if(content.value.length > max){
content.value = content.value.substring(0,max);
used.innerHTML = max;
remain.innerHTML = 0;
alert("最多只能输入100字!");
}else{
used.innerHTML = content.value.length;
remain.innerHTML = max - content.value.length;
}
}
//-->
</script>
<body>
<form action="" method="post">
<table border="1" style="border-collapse:collapse">
<tr>
<td colspan="2" align="center">输入字数统计示例</td>
</tr>
<tr>
<td>内容:</td>
<td>
<textarea id="content" name="content" cols="60" rows="6" onkeydown="gbcount();" onkeyup="gbcount();"></textarea>
</td>
</tr>
<tr>
<td>提示信息:</td>
<td>
请勿超过<span id="total" style="color:#FF0000">100</span>字,
您已经输入了<span id="used" style="color:#FF0000">0</span>字,
还可以继续输入<span id="remain" style="color:#FF0000">100</span>字。
</td>
</tr>
</table>
</form>
</body>
</html>
文本框输入字数统计
字数统计示例
最新推荐文章于 2024-08-09 15:51:34 发布
本文提供了一个简单的HTML页面示例,展示了如何使用JavaScript实时统计文本框内用户输入的内容字数,并给予即时反馈,确保用户输入不会超出限定长度。
306

被折叠的 条评论
为什么被折叠?



