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


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 相关文章推荐
在js(jquery)中获得文本框焦点和失去焦点的方法
Dec 04 Javascript
JavaScript显示当前文档最后修改日期的方法
Mar 19 Javascript
基于jquery实现表格内容筛选功能实例解析
May 09 Javascript
js实现碰撞检测特效代码分享
Oct 16 Javascript
js 实现获取name 相同的页面元素并循环遍历的方法
Feb 14 Javascript
vue中配置mint-ui报css错误问题的解决方法
Oct 11 Javascript
vue router 配置路由的方法
Jul 26 Javascript
node中使用log4js4.x版本记录日志的方法
Aug 20 Javascript
layui table数据修改的回显方法
Sep 04 Javascript
javascript数组元素删除方法delete和splice解析
Dec 09 Javascript
使用JS实现动态时钟
Mar 12 Javascript
详解element-ui 表单校验 Rules 配置 常用黑科技
Jul 11 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漏洞全解(详细介绍)
2012/11/13 PHP
浅析php适配器模式(Adapter)
2014/11/25 PHP
PHP常见漏洞攻击分析
2016/02/21 PHP
javascript 当前日期转化为中文的实现代码
2010/05/13 Javascript
Prototype源码浅析 String部分(三)之HTML字符串处理
2012/01/15 Javascript
seajs学习教程之基础篇
2016/10/20 Javascript
Bootstrap3 多选和单选框(checkbox)
2016/12/29 Javascript
D3.js进阶系列之CSV表格文件的读取详解
2017/06/06 Javascript
php main 与 iframe 相互通讯类(js+php同域/跨域)
2017/09/14 Javascript
jQuery实现的简单动态添加、删除表格功能示例
2017/09/21 jQuery
基于React+Redux的SSR实现方法
2018/07/03 Javascript
详解JSON Web Token 入门教程
2018/07/30 Javascript
vue-cli+axios实现文件上传下载功能(下载接收后台返回文件流)
2019/05/10 Javascript
Javascript如何实现扩充基本类型
2020/08/26 Javascript
javascript自定义加载loading效果
2020/09/15 Javascript
简单实现python数独游戏
2018/03/30 Python
Python处理CSV与List的转换方法
2018/04/19 Python
flask框架实现连接sqlite3数据库的方法分析
2018/07/16 Python
TensorFlow Session使用的两种方法小结
2018/07/30 Python
使用Python实现租车计费系统的两种方法
2018/09/29 Python
python3 打印输出字典中特定的某个key的方法示例
2019/07/06 Python
树莓派安装OpenCV3完整过程的实现
2019/10/10 Python
python GUI库图形界面开发之PyQt5切换按钮控件QPushButton详细使用方法与实例
2020/02/28 Python
Elasticsearch py客户端库安装及使用方法解析
2020/09/14 Python
matplotlib绘制鼠标的十字光标的实现(自定义方式,官方实例)
2021/01/10 Python
中国最大的团购网站:聚划算
2016/09/21 全球购物
柒牌官方商城:中国男装优秀品牌
2017/06/30 全球购物
马来西亚领先的在线礼品店:Giftr
2018/08/23 全球购物
大四自我鉴定范文
2013/10/06 职场文书
棉花姑娘教学反思
2014/02/15 职场文书
决心书标准格式
2014/03/11 职场文书
综治维稳工作承诺书
2014/08/30 职场文书
党员转正党支部意见
2015/06/02 职场文书
2016父亲节感恩话语
2015/12/09 职场文书
详解python网络进程
2021/06/15 Python
SpringBoot详解整合Redis缓存方法
2022/07/15 Java/Android