js trim函数 去空格函数与正则集锦

 更新时间:2009年11月20日 17:29:35   作者:  
在javascript中处理文本框输入值的时候,经常要用到"去掉前后空白"的功能。用过jQuery的朋友都知道,jQuery提供了一个trim()这样的功能函数,可以很轻松帮我们实现这样的效果。
但是如果项目没有用到jQuery等框架的话,js本身又没有这样的函数,我们不得不自己写这样的函数,下面是函数的具体实现:
复制代码 代码如下:

//供使用者调用
function trim(s){
return trimRight(trimLeft(s));
}
//去掉左边的空白
function trimLeft(s){
if(s == null) {
return "";
}
var whitespace = new String(" \t\n\r");
var str = new String(s);
if (whitespace.indexOf(str.charAt(0)) != -1) {
var j=0, i = str.length;
while (j < i && whitespace.indexOf(str.charAt(j)) != -1){
j++;
}
str = str.substring(j, i);
}
return str;
}
//去掉右边的空白
function trimRight(s){
if(s == null) return "";
var whitespace = new String(" \t\n\r");
var str = new String(s);
if (whitespace.indexOf(str.charAt(str.length-1)) != -1){
var i = str.length - 1;
while (i >= 0 && whitespace.indexOf(str.charAt(i)) != -1){
i--;
}
str = str.substring(0, i+1);
}
return str;
}

使用时只需调用trim函数即可。
下面是用正则的实现方法:
复制代码 代码如下:

<SCRIPT LANGUAGE="JavaScript">
<!--
String.prototype.Trim = function()
{
return this.replace(/(^\s*)|(\s*$)/g, "");
}
String.prototype.LTrim = function()
{
return this.replace(/(^\s*)/g, "");
}
String.prototype.RTrim = function()
{
return this.replace(/(\s*$)/g, "");
}
//-->
</SCRIPT>
<input type="text" value="    前后都是空格   " id="space">
<input type="button" value="去前后空格" onclick="javascript:document.getElementById('space').value=document.getElementById('space').value.Trim();document.getElementById('space').select();">
<input type="button" value="去前空格" onclick="javascript:document.getElementById('space').value=document.getElementById('space').value.LTrim();document.getElementById('space').select();">
<input type="button" value="去后空格" onclick="javascript:document.getElementById('space').value=document.getElementById('space').value.RTrim();document.getElementById('space').select();">
<input type="button" value="还原" onclick="javascript:document.getElementById('space').value='    前后都是空格     ';">

上面的代码因为编辑器的问题,空格被替换了,所以大家请注意添加空格,测试。

相关文章

  • 浅谈JavaScript 浏览器对象

    浅谈JavaScript 浏览器对象

    下面小编就为大家带来一篇浅谈JavaScript 浏览器对象。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-06-06
  • 详解如何探测小程序返回到webview页面

    详解如何探测小程序返回到webview页面

    这篇文章主要介绍了详解如何探测小程序返回到webview页面,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-05-05
  • 小程序视频列表中视频的播放与停止的示例代码

    小程序视频列表中视频的播放与停止的示例代码

    本篇文章主要介绍了小程序视频列表中视频的播放与停止的示例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-07-07
  • JavaScript Object的extend是一个常用的功能

    JavaScript Object的extend是一个常用的功能

    对Object的extend是一个常用的功能。举一个例子,由于javascript 没有重载(overload),而且函数的参数类型是没有定义的,所以很多时候我们都传入一个对象来作为参数已方便控制。
    2009-12-12
  • JavaScript defineProperty如何实现属性劫持

    JavaScript defineProperty如何实现属性劫持

    双向数据绑定的核心方法,主要是做数据劫持操作(监控数据变化),下面这篇文章主要给大家介绍了关于JavaScript defineProperty如何实现属性劫持的相关资料,需要的朋友可以参考下
    2021-07-07
  • Array栈方法和队列方法的特点说明

    Array栈方法和队列方法的特点说明

    本篇文章主要是对Array栈方法与队列方法的特点进行了详细的说明介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2014-01-01
  • 详解基于javascript实现的苹果系统底部菜单

    详解基于javascript实现的苹果系统底部菜单

    本篇文章主要对基于javascript实现的苹果系统底部菜单进行了详细的分析说明,有助于理解和学习编写苹果系统底部菜单,相信会对大家有所帮助,下面就跟小编一起来看看吧
    2016-12-12
  • 关于redux-saga中take使用方法详解

    关于redux-saga中take使用方法详解

    本篇文章主要介绍了关于redux-saga中take使用方法详解,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-02-02
  • JavaScript实现简单轮播图效果

    JavaScript实现简单轮播图效果

    这篇文章主要为大家详细介绍了JavaScript实现图片轮播,左右翻转,图片切换显示等效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-12-12
  • JavaScript封闭函数及常用内置对象示例

    JavaScript封闭函数及常用内置对象示例

    这篇文章主要介绍了JavaScript封闭函数及常用内置对象,结合实例形式分析了JavaScript封闭函数及常用内置对象的定义与简单使用相关操作技巧,需要的朋友可以参考下
    2019-05-05

最新评论