js 실시 간 으로 글자 수 알림 을 계산 하 는 텍스트 상자

자 바스 크 립 트 로 이 루어 졌 을 거 라 고 생각 하고 오늘 만 들 었 어 요.원 리 는 간단 합 니 다.텍스트 상자 에서 발생 하 는 onkeyup 이벤트 에 따라 현재 텍스트 상자 문자 의 길 이 를 얻 은 다음 텍스트 상자 에서 입력 한 최대 문자 수 를 현재 문자 수 를 줄 이 고 label 컨트롤 로 표시 하면 됩 니 다.효과 도:데모 코드:function keypress 1()/text 입력 길이 처리{var text 1=document.getElement ById("my text 1").value;var len=15-text1.length; var show="입력 할 수 있 습 니 다"+len+"글자";document.getElementById("name").innerText=show; } function keypress 2()//textarea 입력 길이 처리{var text 1=document.getElementById("myarea").value;var len;//남 은 문자열 의 길 이 를 기록 하 는 if(text1.length>=300)/textarea 컨트롤 은 maxlength 속성 을 사용 할 수 없습니다.이렇게 입력 문자 수 를 표시 합 니 다{document.getElement ById("my area").value=text1.substr(0,300).len=0; } else { len=300-text1.length; } var show="입력 할 수 있 습 니 다"+len+"글자";document.getElementById("pinglun").innerText=show; }

닉네임:

15 글자

댓 글 내용:

<font color="gray"><label id="pinglun">300 자 를 입력 할 수 있 습 니 다</label></font><div><br/>[Ctrl+A 전체 선택:<a href="https://www.jb51.net/article/23421.htm"title="자세 한 내용 보기"target="blank">외부 Js 를 도입 하려 면 페이지 를 새로 고 쳐 야</a>]</div>를 실행 할 수 있 습 니 다.<br><a href="http://common.jb51.net/tag/%E8%AE%A1%E7%AE%97%E5%AD%97%E6%95%B0/1.htm" rel="noreferrer noopener nofollow" title="搜索关于计算字数的文章">计算字数</a> </li>관련 글<br></li><li><a href="https://www.jb51.net/article/14092.htm" title="js批量上传界面的实现" class="img-wrap" rel="noreferrer noopener nofollow"> <img alt="js批量上传界面的实现" src="https://s1.md5.ltd/image/294a8dccd93dc4e781f40a6ffaedeff7.png"/> </a><a class="link title" rel="noreferrer noopener nofollow" href="https://www.jb51.net/article/14092.htm" title="js批量上传界面的实现">js批量上传界面的实现</a>아주 간단 한 기능 에 대해 이야기 하 겠 습 니 다.javascript 으로 구현:<br>일반적인 블 로그 에 서 는 파일 업로드 방식 이 두 가지 가 있 습 니 다.2008-04-04</li><li><a href="https://www.jb51.net/article/17049.htm" title="javascript 表单的友好用户体现" class="img-wrap" rel="noreferrer noopener nofollow"> <img alt="javascript 表单的友好用户体现" src="https://s1.md5.ltd/image/739e7ad0e4fa54ccc809aa8e6a8c7d29.png"/> </a><a class="link title" rel="noreferrer noopener nofollow" href="https://www.jb51.net/article/17049.htm" title="javascript 表单的友好用户体现">javascript 表单的友好用户体现</a>javascript 폼 의 우호 적 인 사용자 구현 코드 2009-01-01</li><li><a href="https://www.jb51.net/article/17185.htm" title="让input不可点击的另一种方法" class="img-wrap" rel="noreferrer noopener nofollow"> <img alt="让input不可点击的另一种方法" src="https://s1.md5.ltd/image/2010b2b130fc29866931b8f947393fcc.png"/> </a><a class="link title" rel="noreferrer noopener nofollow" href="https://www.jb51.net/article/17185.htm" title="让input不可点击的另一种方法">让input不可点击的另一种方法</a>일반적으로 input 에 대한 클릭 불가,입력 불가,수정 불가 등 은 모두 disable=true 라 는 속성 을 사용 하 는데 아래 의 방법 은 js 를 통 해 제어 하 는 것 으로 각각 장점 이 있다.2009-02-02 </li> <li><a href="https://www.jb51.net/article/9656.htm" title="关于脚本操作文本域的问题" class="img-wrap" rel="noreferrer noopener nofollow"> <img alt="关于脚本操作文本域的问题" src="https://s1.md5.ltd/image/d143f29ea348732cb770f3fc9990e031.png"/> </a><a class="link title" rel="noreferrer noopener nofollow" href="https://www.jb51.net/article/9656.htm" title="关于脚本操作文本域的问题">关于脚本操作文本域的问题</a>스 크 립 트 작업 텍스트 필드 에 관 한 문제...2007-04-04</li><li><a href="https://www.jb51.net/article/24571.htm" title="javascript 单选按钮 单击选中 双击取消选择实现代码" class="img-wrap" rel="noreferrer noopener nofollow"> <img alt="javascript 单选按钮 单击选中 双击取消选择实现代码" src="https://s1.md5.ltd/image/98acc557a67d570905ce86dcb4b96706.png"/> </a><a class="link title" rel="noreferrer noopener nofollow" href="https://www.jb51.net/article/24571.htm" title="javascript 单选按钮 单击选中 双击取消选择实现代码">javascript 单选按钮 单击选中 双击取消选择实现代码</a>많은 상황 에서 우 리 는 radio 단일 선택 상자 에 대해 선택 을 취소 해 야 한다.여 기 는 js 의 실현 방법 으로 정말 좋다.2010-08-08 </li> <li><a href="https://www.jb51.net/article/21477.htm" title="javascript获得光标所在的文本框(text/textarea)中的位置" class="img-wrap" rel="noreferrer noopener nofollow"> <img alt="javascript获得光标所在的文本框(text/textarea)中的位置" src="https://s1.md5.ltd/image/e908ca39131e0e663b77ef5324de8d97.png"/> </a><a class="link title" rel="noreferrer noopener nofollow" href="https://www.jb51.net/article/21477.htm" title="javascript获得光标所在的文本框(text/textarea)中的位置">javascript获得光标所在的文本框(text/textarea)中的位置</a>마 우 스 를 이동 하여 셀 이 있 는 표 의 위치 에 있 는 js 코드 를 얻 고 fireforx 를 호 환 하 는 것 을 테스트 합 니 다.필요 한 친 구 는 참고 하 시기 바 랍 니 다.2009-12-12 </li> <li><a href="https://www.jb51.net/article/21275.htm" title="js 操作select相关方法函数" class="img-wrap" rel="noreferrer noopener nofollow"> <img alt="js 操作select相关方法函数" src="https://s1.md5.ltd/image/975380108212d8c58b271cfbf6c5dbc4.png"/> </a><a class="link title" rel="noreferrer noopener nofollow" href="https://www.jb51.net/article/21275.htm" title="js 操作select相关方法函数">js 操作select相关方法函数</a>select 의 조작 실현 코드.select 를 제어 할 수 있 는 친구.우 리 는 이전에 관련 코드 를 많이 제공 했다.2009-12-12 </li> <li><a href="https://www.jb51.net/article/14599.htm" title="javascript实现通过拼音首字母快速选择下拉列表" class="img-wrap" rel="noreferrer noopener nofollow"> <img alt="javascript实现通过拼音首字母快速选择下拉列表" src="https://s1.md5.ltd/image/64ee16bf75ea29078c81574b85a67e0e.png"/> </a><a class="link title" rel="noreferrer noopener nofollow" href="https://www.jb51.net/article/14599.htm" title="javascript实现通过拼音首字母快速选择下拉列表">javascript实现通过拼音首字母快速选择下拉列表</a>예 를 들 어 특정한 옵션 의 병 음 이니셜 은'a'이 고 키보드 의'a'를 누 르 면 이 항목 을 신속하게 선택 할 수 있다.<br>어떻게 강세 자 와 호 환 ff 를 해결 합 니까?<br>ff 아래 어떻게 asc 를 받 을 수 있 습 니까?<br>2008-05-05 </li> <li><a href="https://www.jb51.net/article/654.htm" title="js获取变量" class="img-wrap" rel="noreferrer noopener nofollow"> <img alt="js获取变量" src="https://s1.md5.ltd/image/fe31dcb1596c2f8cd939c121c2fbff65.png"/> </a><a class="link title" rel="noreferrer noopener nofollow" href="https://www.jb51.net/article/654.htm" title="js获取变量">js获取变量</a>js 획득 변수...2006-08-08</li><li><a href="https://www.jb51.net/article/3617.htm" title="关于搜索输入框" class="img-wrap" rel="noreferrer noopener nofollow"> <img alt="关于搜索输入框" src="https://s1.md5.ltd/image/17643549b03d4a0264fe9ca8deabd62f.png"/> </a><a class="link title" rel="noreferrer noopener nofollow" href="https://www.jb51.net/article/3617.htm" title="关于搜索输入框">关于搜索输入框</a>검색 입력 상자 에 대하 여...2006-10-10</li>최신 논평