JavaScript实现替换字符串中最后一个字符的方法

 更新时间:2017年03月07日 11:03:45   作者:翱翔天地  
这篇文章主要介绍了JavaScript实现替换字符串中最后一个字符的方法,涉及javascript字符串的转换与运算相关操作技巧,需要的朋友可以参考下

本文实例讲述了JavaScript实现替换字符串中最后一个字符的方法。分享给大家供大家参考,具体如下:

1、问题背景

在一个输入框中,限制字符串长度为12位,利用键盘输入一个数字,会将字符串中最后一位替换,比如:111111111111,再输入一个3,会显示111111111113

2、具体实现

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JavaScript替换字符串中最后一个字符</title>
<script type="text/javascript">
  function replaceStr()
  {
    var e = event || window.event || arguments.callee.caller.arguments[0];
    var input_str = document.getElementById("input_str").value;
    var newStr = input_str.substring(0,11);
    if(e && e.keyCode>=48 && e.keyCode <= 57)
    {
      newStr += (e.keyCode-48);
    }
    document.getElementById("input_str").value = newStr;
  }
</script>
</head>
<body>
  <input type="text" id="input_str" maxlength="12" onkeyup="replaceStr();"/>
</body>
</html>

3、实现结果

(1)初始化

(2)输入“3”后

4、扩展附录

jQuery中的实现方法:

$("#input_str").keydown(function(event){
  var nums = $("#input_str").val();
  var e = event || window.event || arguments.callee.caller.arguments[0];
  var newStr = nums.substring(0,11);
  if(e && e.keyCode>=48 && e.keyCode <= 57)
  {
    newStr += (e.keyCode-48);
  }
  $("#input_str").val(newStr);
});

更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript数学运算用法总结》、《JavaScript中json操作技巧总结》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript动画特效与技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》及《JavaScript遍历算法与技巧总结

希望本文所述对大家JavaScript程序设计有所帮助。

相关文章

  • 小程序开发实战指南之封装自定义弹窗组件

    小程序开发实战指南之封装自定义弹窗组件

    最近在做公司的小程序项目,发现设计上有很多不统一,代码上有很多冗余,下面这篇文章主要给大家介绍了关于小程序开发实战指南之封装自定义弹窗组件的相关资料,需要的朋友可以参考下
    2022-11-11
  • Javascript中八种遍历方法的执行速度深度对比

    Javascript中八种遍历方法的执行速度深度对比

    关于数组或对象遍历,相信很多人都没有深入观察过执行效率。这是一个曾在群里吵翻天的话题,读懂后你将成为遍历效率话题的大师。下面这篇文章主要介绍了Javascript中八种遍历方法执行速度深度对比的相关资料,需要的朋友可以参考下。
    2017-04-04
  • bootstrap Table的使用方法总结

    bootstrap Table的使用方法总结

    这篇文章主要为大家详细介绍了bootstrap Table的使用方法,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-05-05
  • 浅述节点的创建及常见功能的实现

    浅述节点的创建及常见功能的实现

    本文主要对节点的创建及常见功能的实现方法进行介绍,希望会对大家学习javascript有所帮助,下面就跟小编一起来看下吧
    2016-12-12
  • 《JavaScript DOM 编程艺术》读书笔记之DOM基础

    《JavaScript DOM 编程艺术》读书笔记之DOM基础

    这篇文章主要介绍了《JavaScript DOM 编程艺术》读书笔记之DOM基础,需要的朋友可以参考下
    2015-01-01
  • IE6-IE9使用JSON、table.innerHTML所引发的问题

    IE6-IE9使用JSON、table.innerHTML所引发的问题

    这篇文章主要介绍了IE6-IE9使用JSON、table.innerHTML所引发的问题 ,需要的朋友可以参考下
    2015-12-12
  • JS中跳转传参的几种常用方法总结

    JS中跳转传参的几种常用方法总结

    在前端开发中我们常常需要从一个跳到另一个页面,并且将当前页面的数据传递过去,下面这篇文章主要给大家总结介绍了关于JS中跳转传参的几种常用方法,文中通过代码介绍的非常详细,需要的朋友可以参考下
    2024-05-05
  • 微信小程序实现手机号码验证

    微信小程序实现手机号码验证

    这篇文章主要为大家详细介绍了微信小程序实现手机号码验证,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-07-07
  • 12 款 JS 代码测试必备工具(翻译)

    12 款 JS 代码测试必备工具(翻译)

    这篇文章主要介绍了12 款 JS 代码测试必备工具(翻译),需要的朋友可以参考下
    2016-12-12
  • js获取对象属性值的两种方法使用总结

    js获取对象属性值的两种方法使用总结

    这篇文章主要给大家介绍了关于js获取对象属性值的两种方法使用,分别是通过.获取和通过[]获取这两种方法,文中介绍了详细的方法和不同点,需要的朋友可以参考下
    2023-05-05

最新评论