首页 期权学习期权知识正文

jQuery显示文本框剩余多少个字数

xiaojiucai 期权知识 2020-08-18 619 0

在网页中,为例提高用户体验,往往会在用户使用文本框时提示文本框最大限定字数以及当用户输入后,提示还可以输入的字符数,我们今天说的jQuery代码来实现该功能。

1、限制文本框里面的字符数,当超过规定的字符数时不能再继续输入,用户在输入过程中会提示还可以输入的字符数

上一张效果图先看一下:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		   <script src="../tu/jquery-1.11.3.min.js"></script>
</head>
<body>
<textarea name="" id="" cols="100" rows="30"></textarea>
<span>你还可以输入<strong style="color:red;">140</strong>个字</span>
<script>
    var maxLength = 140;
    $('textarea').keyup(function(){
        var L = $(this).val().length;
        $('strong').text(maxLength-L);//总字数减去输入的字数

        if(parseInt($('strong').text())<0){
            $('strong').text('0'); //如果输入文字小于0 则文本显示为0
            //alert($(this).val());
            var val1 = $(this).val().substr(1,140);//截取输入长度
            //substr(不推荐使用,ECMAScript没有标准化substr()方法)
            $(this).val(val1);
        }
    })
</script>
</body>
</html>

原文链接:https://www.qiquanji.com/post/7160.html

本站声明:网站内容来源于网络,如有侵权,请联系我们,我们将及时处理。

版权声明

本文仅代表作者观点,不代表本站立场。
本文系作者授权发表,未经许可,不得转载。