用js实现在textarea中每输入15个字符串自动换行 输入汉字超过15个就去加/n自动换行

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了用js实现在textarea中每输入15个字符串自动换行 输入汉字超过15个就去加/n自动换行相关的知识,希望对你有一定的参考价值。

参考技术A $(""textarea).bind('input propertychange', function ()
var len = $(this).val().length;
if(len % 15 == 0)
//添加换行符逻辑


);本回答被提问者和网友采纳

js 实现textarea输入字数提示

一、先看效果图
技术图片

效果如图,当输入文字的时候,提示区域动态的显示已输入的字数和最大输入的字数。非常常用的小功能。
二、知识点
知识点比较简单,为了兼容性好些,我多用了几个事件input、propertychange、paste、keyup。现在好多用vue等框架写,我暂时先用jQuery写了,原因是读者比较好理解,需要其他方式也便于修改,高手估计也不用看这些东西啦哈哈哈。
三、上代码。
我当初学习的时候就希望多看demo,可我找到的资料往往是讲一些要点,写一些代码片段,所以我尽量的直接上代码了。

<!DOCTYPE html>
<html>

    <head>
        <meta charset="UTF-8">
        <title></title>
        <script src="js/jquery-2.1.0.js"></script>
    </head>

    <body>
        <div id="div1">
            <textarea id="text" rows="8" cols="15"></textarea>
            <span></span>
        </div>
        <div id="viewBox">
            <!--这里是显示提示的区域-->
        </div>
        <script type="text/javascript">
            LimitedNnumber("#text", "#viewBox", 9)//调用函数需要传入三个参数,分别为,输入框、显示框、限制的长度(这里是9)

            function LimitedNnumber(eventBox, viewBox, textLength) {//调用函数需要传入三个参数,分别为,输入框、显示框、限制的长度
                $(document).on(‘input propertychange paste keyup‘, eventBox, function(event) {
                    this.value = this.value.replace(this.value.slice(textLength), "")//超出长度的部分替换为空
                    $(viewBox).html(this.value.length + "/" + textLength)
                })
            }
        </script>
    </body>

</html>

以上是关于用js实现在textarea中每输入15个字符串自动换行 输入汉字超过15个就去加/n自动换行的主要内容,如果未能解决你的问题,请参考以下文章

TextArea 如何用js判断每11个字符就让他换行,有回车的效果,假如我一直输入不按回车也会判断有多少行

textarea如何实现高度自适应?

求一段JS的函数代码....

js库链接

在管道输入中每4个字符添加一个空格

jQuery实现限制input框 textarea文本框输入字符数量的方法