一、JQuery扩展

; (function ($) {
/*
* 文本域光标操作(选、添、删、取)的jQuery扩展 http://www.cnblogs.com/phpyangbo/p/5528648.html
*/
$.fn.extend({
/*
* 获取光标所在位置
*/
iGetFieldPos: function () {
var field = this.get(0);
if (document.selection) {
//IE
$(this).focus();
var sel = document.selection;
var range = sel.createRange();
var dupRange = range.duplicate();
dupRange.moveToElementText(field);
dupRange.setEndPoint('EndToEnd', range);
field.selectionStart = dupRange.text.length - range.text.length;
field.selectionEnd = field.selectionStart + range.text.length;
}
return field.selectionStart;
},
/*
* 选中指定位置内字符 || 设置光标位置
* --- 从start起选中(含第start个),到第end结束(不含第end个)
* --- 若不输入end值,即为设置光标的位置(第start字符后)
*/
iSelectField: function (start, end) {
var field = this.get(0);
//end未定义,则为设置光标位置
if (arguments[1] == undefined) {
end = start;
}
if (document.selection) {
//IE
var range = field.createTextRange();
range.moveEnd('character', -$(this).val().length);
range.moveEnd('character', end);
range.moveStart('character', start);
range.select();
} else {
//非IE
field.setSelectionRange(start, end);
$(this).focus();
}
},
/*
* 选中指定字符串
*/
iSelectStr: function (str) {
var field = this.get(0);
var i = $(this).val().indexOf(str);
i != -1 ? $(this).iSelectField(i, i + str.length) : false;
},
/*
* 在光标之后插入字符串
*/
iAddField: function (str,shuru_value) {
var field = this.get(0);
var v = $(this).val();
var len = $(this).val().length;
if (document.selection) {
//IE
$(this).focus()
document.selection.createRange().text = str;
} else {
//非IE
var selPos = field.selectionStart;
$(this).val($(this).val().slice(0, field.selectionStart) + str + $(this).val().slice(field.selectionStart, len)); this.iSelectField(selPos + shuru_value); };
},
/*
* 删除光标前面(-)或者后面(+)的n个字符
*/
iDelField: function (n) {
var field = this.get(0);
var pos = $(this).iGetFieldPos();
var v = $(this).val();
//大于0则删除后面,小于0则删除前面
$(this).val(n > 0 ? v.slice(0, pos - n) + v.slice(pos) : v.slice(0, pos) + v.slice(pos - n));
$(this).iSelectField(pos - (n < 0 ? 0 : n));
}
});
})(jQuery);

二、使用示例

//向文本域光标所在区域添加内容
var shuru_value = '博客园';
$(".yb_content").iAddField(shuru_value,shuru_value.length);

jquery 文本域光标操作(选、添、删、取)的更多相关文章

  1. 文本域光标操作(选、添、删、取)的jQuery扩展

    ; (function ($) { /* * 文本域光标操作(选.添.删.取)的jQuery扩展 @Mr.Think http://mrthink.net/text-field-jquery-exte ...

  2. 关于bootstrap--表单(下拉<select>、输入框<input>、文本域<textare>复选框<checkbox>和单选按钮<radio>)

    html 里面的 role 本质上是增强语义性,当现有的HTML标签不能充分表达语义性的时候,就可以借助role来说明.通常这种情况出现在一些自定义的组件上,这样可增强组件的可访问性.可用性和可交互性 ...

  3. spring mvc:常用标签库(文本框,密码框,文本域,复选框,单选按钮,下拉框隐藏于,上传文件等)

    在jsp页面需要引入:<%@taglib uri="http://www.springframework.org/tags/form" prefix="form&q ...

  4. js、jquery对节点的操作(增、删)

    js对节点的操作方法 一.获取 1.父节点的获取 某节点的parentNode属性值即为该节点的父节点.示例: var parent = document.getElementById("o ...

  5. js实现文本框文本域光标处插入图片文本的插件(并且光标在插入内容的内容后显示)

    js: /******************************************* * * 插入光标处的插件 * @authors Du xin li * @update    2015 ...

  6. jQuery 文本框 光标 移动到 文字最后

    方法一:调用办法:setCaretToPos(document.getElementById("YOURINPUT"), 4); function setSelectionRang ...

  7. jquery捕捉文本域输入事件

    <input type='text' /> change事件是在文本域光标失去焦点时才会触发,要监听正在输入内容事件用键盘事件监听如果想要捕捉文本域输入事件,可以使用$("inp ...

  8. Jquery学习笔记:操作form表单元素之一(文本框和下拉框)

    一.概述 在web页面开发中,经常需要获取和设置表单元素的值(如文本框中的内容),特别是在ajax应用中,更是常态.本文系统的介绍下如何操作. 同操作其它html元素一样,操作的过程差不多. 第一步, ...

  9. jQuery操作标签--样式、文本、属性操作, 文档处理

    1.样式 2.文本 3.属性操作 全选,反选效果 4.文档处理 操作标签 一.样式操作 样式类: addClass(); // 添加指定的css类名 removeClass(); //移除指定的css ...

随机推荐

  1. Windows Store App 获取文件及文件夹列表

    通过使用13.2.1小节给出的方法和属性,不仅可以对用户库中的文件和文件夹进行操作,还可以获取其中所有的文件或者文件夹,比如为了完整地展现整个音乐库,可以获取并列举出音乐库中所有的音乐文件,以便能够在 ...

  2. 安装Pod时提示ERROR: While executing gem ... (Errno::EPERM) Operation not permitted - /usr/bin/pod

    环境:OSX EI 10.11.1 昨天切换gem源后,招待pod安装没有任何问题,也可以正常用$ gem sources --add https://ruby.taobao.org/ --remov ...

  3. Java:Map

    接口Map<K,V>,K – 映射所维护的键的类型:V – 映射值的类型. public interface Map<K,V>,将键映射到值的对象.一个映射不能包括重复的键:每 ...

  4. 【源码】c#编写的安卓客户端与Windows服务器程序进行网络通信

    NetworkComms网络通信框架序言 用c#开发安卓程序 (xamarin.android)系列之三 源码(包含客户端与服务器端所有工程文件)    数据库文件 为了方便您测试,我临时搭建了一个服 ...

  5. bzoj3730:震波

    题意:给一棵树,只有点权无边权, ,每次询问求以一个点为中心,半径为k的全职和. 考虑动态树分治.我们对于每个点(点分树)维护两个树状数组.两个树状数组都以距离为下标,权值为内容.第一个树状数组维护子 ...

  6. Hadoop运行错误纪录

    问题1:Cannot run program "/bin/ls": error=11, Resource temporarily unavailable 15/04/22 14:4 ...

  7. ios中tableSection的颜色

    ios中tableSection的颜色可以用: @"0xf5f5f5",有个第三方库 #import "UIColor+expanded.h"可以支持十六进制取 ...

  8. Data storage on the batch layer

    4.1 Storage requirements for the master dataset To determine the requirements for data storage, you ...

  9. 批处理与python代码混合编程的实现方法

    批处理可以很方便地和其它各种语言混合编程,除了好玩,还有相当的实用价值, 比如windows版的ruby gem包管理器就是运用了批处理和ruby的混合编写, bathome出品的命令工具包管理器bc ...

  10. SecureCRT清屏

    Ctrl + l:清屏Ctrl + c:终止命令Ctrl + z:挂起命令