去除字符串左右两边的空格(实现代码)


Posted in Javascript onMay 12, 2016
在日常工作中,过滤表单中的一些特殊的字符是很常见的功能,比如文本中要求输入单纯的数字,但用户有时会误输入一些多余的空格或其他字符混合的文本,这显然不符合输入要求。
下面一起来学习怎么样去除字符串左右两边的空格。
过滤前:

去除字符串左右两边的空格(实现代码)

过滤后:

去除字符串左右两边的空格(实现代码)

HTML代码:
<div class="main">
     <input id="userName" type="text" placeholder="请输入用户名">
     <input id="rule" type="button" value="过滤">
   </div>

CSS代码:

html,body,div,input{margin:0;padding:0;}
    .main{width:400px;height:auto;padding:0 15px;text-align:center;}
    .main input{width:100%;height:35px;border:none;margin-top:20px;border-radius:5px;}
    input[type="text"]{text-align:left;padding-left:15px;box-sizing:border-box;border:1px solid blue;}
    input[type="button"]{width:50%;background:blue;}
    @media only screen and (max-width: 415px) {
      .main{width:100%;box-sizing:border-box;}
    }

js部分:

var userName = document.getElementById('userName'),
        rule   = document.getElementById('rule'),
        regexEmpty = /^(\s|\u00A0)+|(\s|\u00A0)+$/g;

    rule.onclick = function (){
      userName.value = userName.value.replace(regexEmpty,''); //正则替换
      console.log(userName.value);
    }

以上这篇去除字符串左右两边的空格(实现代码)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript var变量隐式声明方法
Oct 19 Javascript
JavaScript 事件系统
Jul 22 Javascript
html5 canvas js(数字时钟)实例代码
Dec 23 Javascript
Backbone.js中的集合详解
Jan 14 Javascript
JavaScript获取一个范围内日期的方法
Apr 24 Javascript
浅析JS获取url中的参数实例代码
Jun 14 Javascript
js定时器实例分享
Dec 20 Javascript
BootStrap Fileinput初始化时的一些参数
Dec 30 Javascript
ES6新特性之字符串的扩展实例分析
Apr 01 Javascript
element的el-table中记录滚动条位置的示例代码
Nov 06 Javascript
js 递归json树实现根据子id查父id的方法分析
Nov 08 Javascript
JS canvas实现画板和签字板功能
Feb 23 Javascript
20分钟轻松创建自己的Bootstrap站点
May 12 #Javascript
基于BootStrap Metronic开发框架经验小结【一】框架总览及菜单模块的处理
May 12 #Javascript
设置点击文本框或图片弹出日历控件的实现代码
May 12 #Javascript
Bootstrap3制作图片轮播效果
May 12 #Javascript
JS创建事件的三种方法(实例代码)
May 12 #Javascript
jQuery判断checkbox选中状态
May 12 #Javascript
Bootstrap3制作自己的导航栏
May 12 #Javascript
You might like
PHP 强制性文件下载功能的函数代码(任意文件格式)
2010/05/26 PHP
php数组函数序列之array_sum() - 计算数组元素值之和
2011/10/29 PHP
解析WordPress中控制用户登陆和判断用户登陆的PHP函数
2016/03/01 PHP
iis6手工创建网站后无法运行php脚本的解决方法
2017/06/08 PHP
PHP+Apache环境中如何隐藏Apache版本
2017/11/24 PHP
PHP+Redis 消息队列 实现高并发下注册人数统计的实例
2018/01/29 PHP
PHP实现函数内修改外部变量值的方法示例
2018/12/28 PHP
Yii2框架实现利用mpdf创建pdf文件功能示例
2019/02/08 PHP
自动检查并替换文本框内的字符
2006/06/30 Javascript
Javascript之文件操作
2007/03/07 Javascript
jquery实现微博文字输入框 输入时显示输入字数 效果实现
2013/07/12 Javascript
Redis基本知识、安装、部署、配置笔记
2015/03/05 Javascript
微信小程序 支付简单实例及注意事项
2017/01/06 Javascript
Vue ElementUI之Form表单验证遇到的问题
2017/08/21 Javascript
详解express + mock让前后台并行开发
2018/06/06 Javascript
页面内锚点定位及跳转方法总结(推荐)
2019/04/24 Javascript
微信小程序返回箭头跳转到指定页面实例解析
2019/10/08 Javascript
socket + select 完成伪并发操作的实例
2017/08/15 Python
python实现Virginia无密钥解密
2019/03/20 Python
python 实现图像快速替换某种颜色
2020/06/04 Python
keras打印loss对权重的导数方式
2020/06/10 Python
使用Python制作一盏 3D 花灯喜迎元宵佳节
2021/02/26 Python
CSS3哪些新特性值得称赞
2016/03/02 HTML / CSS
详解如何解决canvas图片getImageData,toDataURL跨域问题
2018/09/17 HTML / CSS
Bowflex美国官方网站:高级家庭健身器材
2017/12/22 全球购物
副总经理工作职责
2013/11/28 职场文书
幼儿园教师岗位职责
2014/03/17 职场文书
三年级学生评语
2014/04/23 职场文书
工商行政管理专业求职书
2014/05/23 职场文书
个人授权委托书样本
2014/09/13 职场文书
借条如何写
2015/05/26 职场文书
采购员工作总结范文
2015/08/12 职场文书
《火烧云》教学反思
2016/02/23 职场文书
java Nio使用NioSocket客户端与服务端交互实现方式
2021/06/15 Java/Android
MySQL8.0的WITH查询详情
2021/08/30 MySQL
十大最帅动漫男主 碓冰拓海上榜,第一是《灌篮高手》男主角
2022/03/18 日漫