输入文字自动变化宽度的INPUT,带计数（图）

<!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=utf-8" /> 
<title>随着输入文字的多少自动变化宽度的INPUT，带计数</title> 
<img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20language%3D%22javascript%22%3E%20%0D%0Afunction%20checkLength(which)%20%7B%20%0D%0Avar%20maxchar%3D20%3B%20%0D%0Avar%20oTextCount%20%3D%20document.getElementById(%22char%22)%3B%20%0D%0AiCount%20%3D%20which.value.replace(%2F%5B%5E%5Cu0000-%5Cu00ff%5D%2Fg%2C%22aa%22).length%3B%20%0D%0Aif(iCount%3C%3Dmaxchar)%20%0D%0A%7B%20%0D%0AoTextCount.innerHTML%20%3D%20%22%3Cfont%20color%3D%23FF0000%3E%22%2B%20iCount%2B%22%3C%2Ffont%3E%22%3B%20%0D%0Awhich.style.border%20%3D%20'1px%20dotted%20%23FF0000'%3B%20%0D%0Awhich.size%3DiCount%2B2%3B%20%0D%0A%7D%20%0D%0Aelse%20alert(%22%E8%AF%B7%E4%B8%8D%E8%A6%81%E8%B6%85%E8%BF%87%22%2Bmaxchar)%3B%20%0D%0A%7D%20%0D%0A%3C%2Fscript%3E"> 
</head> 
<body> 
<input name="words" size="2" maxlength="100" onkeyup="checkLength(this)"/> 
<span id="char">0</span>个字符 
</body> 
</html>

　　 [Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

教程首页更多教程