54.截取字符串的思想实现输入框字数限制

转载于 2017-06-30 15:42:00 发布 · 73 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/mx2036/p/7099180.html

本文介绍了一种使用JavaScript和HTML实现输入框字数限制的方法。通过监听输入事件并在达到预设长度时截断字符串来确保输入内容不会超出限定长度。

 1 <!DOCTYPE html>
 2 <html>
 3 <head lang="en">
 4     <meta charset="UTF-8">
 5     <title>截取字符串的思想实现输入框字数限制</title>
 6 </head>
 7 <body>
 8 
 9 <input id="t" oninput="text(this.value)"/>
10 <script>
11     function text(content) {
12         if (content.length > 5) {
13             document.getElementById("t").value =
14                     document.getElementById("t").value.substring(0, 5);
15         }
16     }
17 </script>
18 </body>
19 </html>

View Code

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>截取字符串的思想实现输入框字数限制</title>
</head>
<body>

<input id="t" oninput="text(this.value)"/>
<script>
    function text(content) {
        if (content.length > 5) {
            document.getElementById("t").value =
                    document.getElementById("t").value.substring(0, 5);
        }
    }
</script>
</body>
</html>