`
tooby
  • 浏览: 118242 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

jQuery在当前焦点插入字符

 
阅读更多
(function($){
$.fn.extend({
"insert":function(value){
//默认参数
value=$.extend({
"text":"123"
},value);
var dthis = $(this)[0]; //将jQuery对象转换为DOM元素
//IE下
if(document.selection){
$(dthis).focus(); //输入元素textara获取焦点
var fus = document.selection.createRange();//获取光标位置
fus.text = value.text; //在光标位置插入值
$(dthis).focus(); ///输入元素textara获取焦点
}
//火狐下标准
else if(dthis.selectionStart || dthis.selectionStart == '0'){
var start = dthis.selectionStart;    //获取焦点前坐标
var end =dthis.selectionEnd;   //获取焦点后坐标
    //以下这句,应该是在焦点之前,和焦点之后的位置,中间插入我们传入的值 .然后把这个得到的新值,赋给文本框
      dthis.value = dthis.value.substring(0, start) + value.text + dthis.value.substring(end, dthis.value.length); }
    //在输入元素textara没有定位光标的情况
      else{
          this.value += value.text; this.focus();
      };
      return $(this);
    }
  })
})(jQuery) 

 主要思路:
  当点击某个元素的时候,让一个输入框,插入指定的值。?
  1.当点击某个元素的时候,应该让输入框获取焦点,因为只有获得了焦点,才能在里面输入值;
  IE下:document.selection.createRange()
  FF下:var start = dthis.selectionStart;    //获取焦点前坐标
     var end =dthis.selectionEnd;    //获取焦点后坐标
  2.获取当前输入框焦点的位置
  3.将值插入到输入框焦点的位置;
  4.再次获取焦点;保证光标在输入框内

分享到:
评论

相关推荐

    猎豹jQuery全屏焦点图代码,兼容主流浏览器

    在这个案例中,jQuery可能被用来选择屏幕上的焦点图容器,插入图片元素,并动态改变它们的显示状态。 4. **事件处理**:为了实现焦点图的自动切换和用户交互(如点击按钮切换图片),jQuery的事件监听器会被使用。...

    jQuery 在光标定位的地方插入文字的插件

    //将jQuery对象转换为DOM元素 //IE下 if(document.selection){ $(dthis).focus(); //输入元素textara获取焦点 var fus = document.selection.createRange();//获取光标位置 fus.text = value.text; /

    jquery实现在光标位置插入内容的方法

    在本篇文档中,我们主要讨论了使用jQuery实现光标位置插入内容的方法,该方法涉及到了jQuery功能的扩展技巧,对于需要在Web页面上实现这一功能的开发者来说具有一定的参考价值。 首先,文中提到了jQuery本身的一些...

    jQuery实现在textarea指定位置插入字符或表情的方法

    本文将深入探讨如何使用jQuery实现在textarea指定位置插入字符或表情的方法,这对于构建具有富文本编辑功能的应用非常有用。 首先,我们要创建一个自定义的jQuery插件方法,名为`insertAtCaret`。这个方法会接受一...

    jQuery往textarea中光标所在位置插入文本的方法

    4. 插入文本:在textarea中插入文本涉及到的JavaScript操作包括获取当前光标位置、在光标位置插入字符串、恢复光标焦点等。本文通过判断浏览器类型和版本,使用不同的方法获取和设置光标位置。 5. 文本操作:在...

    超实用的jQuery代码段

    2.24 限制输入框仅接受特殊字符的输入 2.25 禁止页面内全部超链接 2.26 实现动态组合列表框 2.27 如何使用属性过滤器 2.28 如何测试某个元素是否可见 第3章 jQuery操作HTML事件 3.1 禁止或启用输入框 3.2 实时监听...

    jquery 确定光标位置

    在实际应用中,掌握这些技巧可以帮助开发者创建更丰富的用户界面,例如在输入时自动完成、在错误发生时高亮显示错误位置,或者在用户输入特定字符时自动插入文本等。了解并熟练使用这些方法,是提升前端开发能力的...

    jquery.autocomplete.zip

    `jQuery.autocomplete`提供了丰富的配置选项,如`minLength`(最小输入字符数)、`delay`(延迟请求时间)、`appendTo`(提示框插入位置)等。此外,还可以自定义`select`和`focus`事件,分别处理用户选择建议项和...

    jquery实现百度搜索关键字输入下拉框提示

    在网页开发中,jQuery 是一个广泛使用的 JavaScript 库,它简化了 DOM 操作、事件处理、动画设计以及Ajax交互。本项目"jquery实现百度搜索关键字输入下拉框提示"是利用 jQuery 实现类似百度搜索框的功能,即用户在...

    jquery-autocomplete

    `jQuery-autocomplete` 是一个基于 jQuery 的开源插件,用于实现自动补全功能。这个插件使得在网页表单输入框中快速、高效地提供下拉建议变得简单易行,提高了用户界面的交互性和用户体验。它广泛应用于搜索引擎、...

    jQuery文本框输入表情符号代码.zip

    这通常指的是一个使用jQuery编写的脚本,允许用户在输入框(textarea或input[type="text"])中插入预定义的表情符号。这些表情通常以图片或Unicode字符的形式存在,通过点击或输入特定快捷键来插入。这种功能提高了...

    JQuery 漂亮的软键盘

    2. **特殊字符输入**:软键盘支持输入各种特殊字符,如数字、标点符号、甚至是特定的符号,这在填写表单或密码输入时尤其有用。 3. **多种皮肤切换**:为了提供更好的视觉效果和用户体验,该插件提供了多款皮肤供...

    jquery validate的漂亮css样式验证

    你可以选择在用户失去焦点时验证,或者在提交表单时一次性验证所有字段。 10. **禁用和启用验证**:有时你可能希望在某些情况下禁用验证,例如在编辑模式下。`validate()`方法的`.disable()`和`.enable()`方法可以...

    前端项目-jquery.devbridge-autocomplete.zip

    5. **事件驱动编程**:jQuery的事件模型在这里发挥了关键作用,如`keyup`事件用于检测用户输入的变化,`focus`和`blur`事件控制输入框的焦点状态,触发相应的功能。 6. **Ajax请求**:对于远程数据源,jQuery的Ajax...

    jquery tag插件input文本域输入文字创建标签文字效果

    - **jQuery代码**:通过监听input事件,当用户停止输入一段时间后(例如300毫秒),将当前文本转换为新的标签并插入到页面中。同时,还需要处理删除标签、防止重复标签等功能。 - **事件处理**:如`keyup`事件用于...

    jQuery详细教程

    jQuery 使用 $ 符号作为 jQuery 的简介方式。 某些其他 JavaScript 库中的函数(比如 Prototype)同样使用 $ 符号。 jQuery 使用名为 noConflict() 的方法来解决该问题。 var jq=jQuery.noConflict(),帮助您使用...

    Js 清新漂亮的软键盘(基于jquery插件)

    它可能包括数字键、字母键、特殊符号以及常见的功能键如退格、回车等。由于是基于jQuery构建的,所以可以利用jQuery的便利性,如选择器、事件绑定和动画效果,使得软键盘的显示和隐藏、按键响应等操作更加流畅。 在...

    jquery实时缩略图加载显示.rar

    `FileReader`提供了多种读取方法,如`readAsDataURL()`,它会将文件读取为一个数据URL,即Base64编码的字符串,可以直接插入到`<img>`标签的`src`属性中显示图片。 下面是一个基本的实现步骤: 1. 创建一个`...

    jQuery仿IOS6虚拟键盘插件.zip

    在这个项目中,jQuery被用来监听输入框的焦点事件,当用户点击输入框时触发虚拟键盘的显示,并在用户在键盘上按键时处理相应的键盘事件。 CSS特效在此插件中起到了关键作用,它定义了键盘的样式和布局,包括按钮的...

Global site tag (gtag.js) - Google Analytics