hi,欢迎访问本站!
当前位置: 首页Web前端正文

textarea禁止输入空格与回车的方法

墨初 Web前端 1936阅读

在Web开发中,textarea是一个常用的html表单元素,它可以让用户输入多行文本。但是,有时候我们需要限制用户输入的内容,比如禁止输入空格和回车。下面的博文73so博客就说一下如何禁止textarea输入回车与空格折方法

js禁止textarea输入空格与回车的方法

1、禁止textarea输入空格

借助js脚本通过使用正则的方法来禁止textarea输入空格。

例1:

<textarea type="text" onkeyup="this.value=this.value.replace(/^ +| +$/g,'')"></textarea>

例2:

<textarea onkeydown="checkEnter(event)"></textarea>
<script>
function checkEnter(e) {
    var et = e || window.event;
    var keycode = et.charCode || et.keyCode;
    if (keycode == 32) {
        if (window.event) {
            window.event.returnValue = false;
        } else {
            e.preventDefault(); //for firefox
        }
    }
}
</script>

2、禁止textarea输入回车/换行

例1:

<textarea onkeydown="checkEnter(event)"></textarea>
<script>
function checkEnter(e) {
    var et = e || window.event;
    var keycode = et.charCode || et.keyCode;
    if (keycode == 13) {
        if (window.event) {
            window.event.returnValue = false;
        } else {
            e.preventDefault(); //for firefox
        }
    }
}
</script>

例2:

下面的示例是禁止textarea输入空格与回车。

<textarea onkeydown="checkEnter(event)"></textarea>
<script>
function checkEnter(e) {
    var et = e || window.event;
    var keycode = et.charCode || et.keyCode;
    if (keycode == 13 || keycode == 32) {
        if (window.event) {
            window.event.returnValue = false;
        } else {
            e.preventDefault(); //for firefox
        }
    }
}
</script>

以上就是关textarea元素中禁止输入空格与回车的方法,上面都是借助的js脚本来实现的,大家不妨测试一下。

声明:无特别说明,转载请标明本文来源!
相关推荐