js 公式编辑器 - 自定义匹配规则 - 带提示下拉框(3)

  成的区域 (oldCurrentPos,currentPos)就是我们检索值所在区域 

               

 // 获取检索值开始位置 oldCurrentPos
  var getOldCurrentPos = function(){
   getStart(); // 开始输入的时候的光标位置 currentPos
   oldCurrentPos = currentPos; // 储存输入开始位置
   console.log(oldCurrentPos);
  }

  设置光标位置

  选择当前项重组输入框 value 值后光标是默认显示在最后的,这当然不符合我们的开发需求,我们想要的效果是事件结束时光标能在我们编辑结束的位置(关于value值重组我们在下面的方法中再看)               

 // 设置光标位置
  var setCarePosition = function(start,end) {
   if(navigator.userAgent.indexOf("MSIE") > -1){
   var all_range = '';
   if( _this.get(0).tagName == "TEXTAREA" ){ 
    // 根据body创建textRange
    all_range = document.body.createTextRange();
    // 让textRange范围包含元素里所有内容
    all_range.moveToElementText(_this.get(0));
   } else {
    // 根据当前输入元素类型创建textRange
    all_range = _this.get(0).createTextRange();
   }
   _this.focus();
   // 将textRange的start设置为想要的start
   all_range.moveStart('character',start);
   // 将textRange的end设置为想要的end. 此时我们需要的textRange长度=end-start; 所以用总长度-(end-start)就是新end所在位置
   all_range.moveEnd('character',-(all_range.text.length-(end-start)));
   // 选中从start到end间的文本,若start=end,则光标定位到start处
   all_range.select();
   }else{
   // 文本框获取焦点
   _this.focus();
   // 选中从start到end间的文本,若start=end,则光标定位到start处
   _this.get(0).setSelectionRange(start,end);
   }
  };

  结束检索事件

  在结束检索事件中我们需要初始化下拉框以及关闭开关,这里需要将该方法声明在获取检索值方法前面,因为获取值后整个事件流程结束,我们需要初始化变量为下一次事件触发做好准备             

// 结束检索事件
  var endSearch = function(){
   _this.dropdown.find("li").remove(); // 移除下拉框中的选项
   _this.dropdown.hide(); // 隐藏下拉框
   searchStart = false; // 初始化检索开关 searchStart
   enterCharacter=''; // 初始化当前字符
  }

   获取检索的值

   看下方代码,我们能够获取值的前提是 searchStart 开关 打开状态,这里我们为了保持插件的灵活性,将触发字符设置为变量,这里默认为 $ 和 . ,enterCharacter为当前输入的字符,

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.heiqu.com/361.html