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


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日期相关函数总结分享
Oct 15 Javascript
js函数与php函数的区别实例浅析
Jan 12 Javascript
JS中Eval解析JSON字符串的一个小问题
Feb 21 Javascript
JavaScript类的写法
Sep 17 Javascript
深入理解Javascript中的观察者模式
Feb 20 Javascript
JS运动特效之同时运动实现方法分析
Jan 24 Javascript
Vue 通过自定义指令回顾v-内置指令(小结)
Sep 03 Javascript
vue.js父子组件通信动态绑定的实例
Sep 28 Javascript
说说Vue.js中的functional函数化组件的使用
Feb 12 Javascript
layui form表单提交之后重新加载数据表格的方法
Sep 11 Javascript
使用kbone解决Vue项目同时支持小程序问题
Nov 08 Javascript
Vue router配置与使用分析讲解
Dec 24 Vue.js
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 PDO函数库详解
2010/04/27 PHP
php park、unpark、ord 函数使用方法(二进制流接口应用实例)
2010/10/19 PHP
初步介绍PHP扩展开发经验分享
2012/09/06 PHP
PHP抓取远程图片(含不带后缀的)教程详解
2016/10/21 PHP
PHP实现在对象之外访问其私有属性private及保护属性protected的方法
2017/11/20 PHP
js实现权限树的更新权限时的全选全消功能
2009/02/17 Javascript
javascript限制文本框只允许输入数字(曾经与现在的方法对比)
2013/01/18 Javascript
nodejs实现HTTPS发起POST请求
2015/04/23 NodeJs
Javascript实现跑马灯效果的简单实例
2016/05/31 Javascript
Node.js如何自动审核团队的代码
2016/07/20 Javascript
购物车前端开发(jQuery和bootstrap3)
2016/08/27 Javascript
vuejs动态组件给子组件传递数据的方法详解
2016/09/09 Javascript
js实现水平滚动菜单导航
2017/07/21 Javascript
JS加密插件CryptoJS实现的DES加密示例
2018/08/16 Javascript
vue项目中使用Hbuilder打包app 设置沉浸式状态栏的方法
2018/10/22 Javascript
KOA+egg.js集成kafka消息队列的示例
2018/11/09 Javascript
vue发送websocket请求和http post请求的实例代码
2019/07/11 Javascript
JAVA面试题 static关键字详解
2019/07/16 Javascript
浅谈vue 锚点指令v-anchor的使用
2019/11/13 Javascript
JS表单验证插件之数据与逻辑分离操作实例分析【策略模式】
2020/05/01 Javascript
JavaScript 实现继承的几种方式
2021/02/19 Javascript
布同自制Python函数帮助查询小工具
2011/03/13 Python
Python编程把二叉树打印成多行代码
2018/01/04 Python
Python Selenium 设置元素等待的三种方式
2020/03/18 Python
Python爬虫入门有哪些基础知识点
2020/06/02 Python
如何解决python多种版本冲突问题
2020/10/13 Python
一款利用纯css3实现的360度翻转按钮的实例教程
2014/11/05 HTML / CSS
碧欧泉Biotherm加拿大官方网站:法国高端护肤品牌
2019/10/18 全球购物
Java里面如何创建一个内部类的实例
2015/01/19 面试题
用C语言实现文件读写操作
2013/10/27 面试题
法律专业个人实习自我鉴定
2013/09/23 职场文书
学习经验交流会主持词
2014/04/01 职场文书
房屋转让协议书
2014/10/18 职场文书
2015年小学数学教师工作总结
2015/05/20 职场文书
创业计划书之烤红薯
2019/09/26 职场文书
OpenCV3.3+Python3.6实现图片高斯模糊
2021/05/18 Python