第一个是在 textarea 输入框中添加固定的内容。

代码如下:

<textarea id="text" cols="30" rows="10"></textarea>
<br>
<button id="btn">添加公司</button>
var textareaIndex = 0;
$("#text").on('keydown',function(e){
textareaIndex = this.selectionStart+1;
if(e.keyCode == 8){
var starText,endText,replaceText;
var text = $(this).val();
var selectionIndex = this.selectionStart-1;
if(text[selectionIndex]==']'){
var result = rep(text,selectionIndex);
$(this).val(result.text);
this.selectionStart = this.selectionEnd = result.index;
return false;
}
}
}) $("#text").click(function(){
textareaIndex = this.selectionStart; // 获取光标所在下标
}) function rep(str,index){
var i = index,k='no';
while(i>0){
if(str[--i]=='['){
k = i;
break;
}
}
if(k=='no')k=index
return {text:str.substring(0,k)+str.substring(index+1),index:k}
} $('#btn').click(function(){
var text = $("#text").val();
var str = text.substring(0,textareaIndex);
var texts = str + '[公司名称]' + text.substring(textareaIndex,text.length);
$("#text").val(texts);
})

效果在此就不展示了。(不过到最后并不能满足大部分需求所以并没有使用这种方法,使用的是 HTML 5 的新属性 contenteditable)。

第二个是研究聊天发表情,是为了实现微信端和小程序端的互相通信,过程中碰到种种困难,尤其是小程序端,所以想到将带表情的内容改变成一个数组形式发送。

代码如下:

var str = '你好,#微笑;1。加油兄弟#握手;#的哈哈但是.#所属;';

function f(str){
var arr = [],tmp = '';
for(var i=0,l=str.length;i<l;i++){
if(str[i]=='#'&&tmp){
arr.push(tmp);
tmp = '';
}
tmp+=str[i];
if(str[i]==';'&&tmp[0]=='#'){
arr.push(tmp);
tmp = '';
}
}
if(tmp)arr.push(tmp)
return arr;
} var data = f(str); console.log(data)
// ["你好,", "#微笑;", "1。加油兄弟", "#握手;", "#的哈哈但是."]

允悲,这种方法是可以实现想要的效果的,只不过有点麻烦,尤其是小程序端,不过最后并没有使用这种方法(原因是发现现在的输入法自带表情,不仅表情全而且无需做任何处理)

工作记录(JS向textarea添加固定内容、通过固定字符将字符串分割为数组)的更多相关文章

  1. js实现把textarea通过换行或者回车把多行数字分割成数组,并且去掉数组中空的值。

    删除数组指定的某个元素 var msg = " ";  //textarea  文本框输入的内容 var emp = [ ];   //定义一个数组,用来存msg分割好的内容 1. ...

  2. CloudBase CMS + Next.js:轻松构建一个内容丰富的站点

    项目背景 试想一下,如果你现在要为你自己或者你所在的组织创建一个强内容的站点,同时要求好的 SEO(搜素引擎优化),比如博客,你会怎么做呢? 由 vite 或者 create-react-app 等脚 ...

  3. JS正则表达式,记录自己所学所用的内容

    还没接触正则表达式感觉确实有那么点难度,但接触到后自己琢磨了几天也没发现那么难. 现在教教刚学的或者还没接触正则表达式的同学们入入门,一起学习. 正则表达式基本语法 ***************** ...

  4. js实现复制|剪切指定内容到粘贴板--clipboard

    这是著名开源项目 clipboard.js 的 README.md,里面讲解的更加详细,有兴趣的同学可以了解一下.项目地址:https://github.com/zenorocha/clipboard ...

  5. 使用div模拟textarea,实现文本输入框高度自适应(附:js控制textarea实现文本输入框高度自适应)

    一.使用textarea标签进行多行文本的输入有很多限制,比如不能实现高度自适应,会出现难看的滚动条等问题. HTML5中添加了一个新属性contenteditable,该属性可以让input,tex ...

  6. 工作记录--WPF自定义控件,实现一个可设置编辑模式的TextBox

    原文:工作记录--WPF自定义控件,实现一个可设置编辑模式的TextBox 1. 背景 因为最近在使用wpf开发桌面端应用,在查看页面需要把TextBox和Combox等控件设置为只读的.原本是个很简 ...

  7. 实现textarea高度自适应内容,无滚动条

    最近接触到一个很好用的js插件,可以实现textarea高度随内容增多而改变,并且不显示滚动条,推荐给大家: http://www.jacklmoore.com/autosize/

  8. Jquery实现textarea根据文本内容自适应高度

    本文给大家分享的是Jquery实现textarea根据文本内容自适应高度,这些在平时的项目中挺实用的,所以抽空封装了一个文本框根据输入内容自适应高度的插件,这里推荐给小伙伴们. autoTextare ...

  9. 随笔 JS 字符串 分割成字符串数组 并动态添加到指定ID的DOM 里

    JS /* * 字符串 分割成字符串数组 并动态添加到指定ID的DOM 里 * @id 要插入到DOM元素的ID * * 输入值为图片URL 字符串 * */ function addImages(i ...

随机推荐

  1. [LeetCode]最长回文子串 java

    题目: 给定一个字符串 s,找到 s 中最长的回文子串.你可以假设 s 的最大长度为1000. 示例 1: 输入: "babad" 输出: "bab" 注意: ...

  2. [原创]K8_C段旁注工具6.0 新增SMB漏洞扫描

    工具: K8_C段旁注工具6.0_0510[K.8]编译: 自己查壳组织: K8搞基大队[K8team]作者: K8拉登哥哥博客: http://qqhack8.blog.163.com发布: 201 ...

  3. System.Threading.ThreadAbortException: 正在中止线程

    症状 如果使用 Response.End.Response.Redirect 或 Server.Transfer 方法,将出现 ThreadAbortException 异常.您可以使用 try-ca ...

  4. es-05-获取 resthighlevelclient及api

    在6.x以前, 使用最多的是transportclient, 但在7.x会被废弃, 先说以前的创建方式: 具体可见:https://www.cnblogs.com/wenbronk/p/6383194 ...

  5. CentOS 7.3.1611编译安装Nginx1.10.3+MySQL5.7.16+PHP7.1.2

    前传: 1.CentOS 7.3.1611系统安装配置图解教程 http://www.jb51.net/os/RedHat/597874.html 2.CentOS服务器初始化设置 http://ww ...

  6. 散列算法-MD5

    信息摘要技术把明文内容按某种规则生成一段哈西值,即使明文消息只改动了一点点,生成的结果也会完全不同. MD5(Message-digest algorithm 5)就是信息摘要的一种实现,它可以从任意 ...

  7. OSI七层模式简单通俗理解

    OSI七层模式简单通俗理解 这个模型学了好多次,总是记不住.今天又看了一遍,发现用历史推演的角度去看问题会更有逻辑,更好记.本文不一定严谨,可能有错漏,主要是抛砖引玉,帮助记性不好的人.总体来说,OS ...

  8. [转]Magento 2.2 Developer Documentation

    本文转自:https://devdocs.magento.com/

  9. 在ASP.NET MVC应用程序中随机获取一个字符串

    在开发ASP.NET MVC应用程序时,有可能需要一个随机字符串,作为密码或是验证码等. 如果你需要的是SQL版本,可以参考<密码需要带特殊字符(二)>http://www.cnblogs ...

  10. 学习MVC和jQuery相关的书

    Insus.NET还是较喜欢看纸质书.学习ASP.NET MVC和jQuery编程,Insus.NET为了加强功力,决定再购买几本相关的书:   十月份时,还买了一本: 前两本快递刚送到手,后一本已经 ...