zoukankan      html  css  js  c++  java
  • 工作记录(JS向textarea添加固定内容、通过固定字符将字符串分割为数组)

    第一个是在 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。加油兄弟", "#握手;", "#的哈哈但是."]

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

  • 相关阅读:
    【软工4】:软件工程和文档
    ER模型图工具:PowerDesigner
    【软工3】:软件工程视频知识总结
    【软工2】:软件开发阶段
    【软工1】:软件计划及软件需求
    【机房收费系统 5】:验收总结(思想)
    【机房收费系统 4】:VB获取标准北京时间,免除时间误差
    网络经济与企业管理(一)
    【机房收费系统 3】:文本框输入数字、小数点、退格键
    .NET Framework
  • 原文地址:https://www.cnblogs.com/wyhlightstar/p/10020689.html
Copyright © 2011-2022 走看看