进入页面时候也需要获取txet内容长度,并且判断(基本都是null)

原创2019-06-07 10:52:1370
摘要:<!DOCTYPE html><html><head><meta charset="UTF-8"><title>输入字数限制与显示</title><script src="https://code.jquery.com/jquery-3.1.1.min.js"></sc

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>输入字数限制与显示</title>

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>

<script type="text/javascript">


$(document).ready(function zishu() {

var text,zishu,m;

text=document.getElementById('text');

zishu=document.getElementById('zishu');

bt=document.getElementById('bt')

    zishu.innerHTML=140-text.value.length;

    text.onkeyup=function tanqi() {

     m=140-text.value.length;

     if (m<0) {

     zishu.style.color='red';

     }else{

     zishu.style.color='#888';

     }

     zishu.innerHTML=m;

    }


    bt.onclick=function () {

     if (m==140) {

     alert("您还没有输入");

     text.focus();

     }else if (m<0) {

     alert("内容超出限制");

     text.focus();

     }else if (m==null) {

     alert("您还没有输入");

     text.focus();

     }else{

     alert("发布成功");

     }

    }

    tanqi();

})


</script>

</head>

<body>

<div>

<div>还可以输入<span id="zishu"></span>字</div>

<textarea id="text"></textarea>

    <input type="button" id="bt" value="发布">

</div>

</body>

</html>


批改老师:查无此人批改时间:2019-06-10 09:28:15
老师总结:完成的不错。学编程,先从模仿开始,继续加油。

发布手记

热门词条