`
bee1314
  • 浏览: 166271 次
  • 性别: Icon_minigender_1
  • 来自: 安徽
社区版块
存档分类
最新评论

jQuery插件创建input选中区域

 
阅读更多


有图有真相,实际效果。

 

 

/**
 * 创建选中区域
 */
(function($) {
    $.fn.selectRange = function(start, end) {
        return this.each(function() {
            if(this.setSelectionRange) {
                var self = this;
                //fix chrome issue
                window.setTimeout(function() {
                    self.setSelectionRange(start, end);
                }, 0);
            } else if(this.createTextRange) {
                var range = this.createTextRange();
                range.collapse(true);
                range.moveEnd('character', end);
                range.moveStart('character', start);
                range.select();
            }
        });
    };
})(jQuery);

使用方式:
1. dom:
<input type="text" id="name" value="aaaaaa">
2:
var len = $("#name").val().length;
$("#name").selectRange(0, len);

 
 

 

  • 大小: 431 Bytes
分享到:
评论

相关推荐

    jquery插件maskedinput实现掩码文本输入框(masked input效果).zip

    本资源"jquery插件maskedinput实现掩码文本输入框(masked input效果).zip"主要关注的是jQuery的一个扩展插件——jQuery Masked Input Plugin,它允许用户按照特定格式输入数据,例如电话号码、日期或信用卡号,从而...

    jQuery插件datalist实现很好看的input下拉列表

    文章提到,一个解决兼容性问题的方案是利用jQuery插件来模拟datalist的行为。使用jQuery的用户能够通过编写JavaScript代码来实现跨浏览器的datalist效果。本文所介绍的插件兼容性良好,覆盖了IE8及以上版本的浏览器...

    jquery 插件

    当你调用一个jQuery插件时,实际上是调用了jQuery对象上的方法,这样就可以对选中的DOM元素进行操作。 ```javascript (function($){ $.fn.myPlugin = function(options) { // 插件的实现代码 }; })(jQuery); ```...

    jQuery插件 简单日期设置

    本主题聚焦于"jQuery插件 简单日期设置",这通常指的是利用jQuery来创建一个简单易用的日历插件,只用于选择日期,不涉及时间选择,适用于那些只需要日期输入的场景。 首先,我们了解jQuery插件的基本结构。一个...

    jQuery插件-多选全选实时搜索下拉框

    在jQuery插件中,通常会监听`input`事件,当用户输入时,获取输入框的值,然后与下拉框中的选项进行比对,动态更新显示的选项列表。 **五、实现原理** 1. **DOM操作**:使用jQuery选择器选取需要操作的元素,如`$...

    Jquery插件-手机端选择省市

    "Jquery插件-手机端选择省市"就是针对这一需求而设计的,它为手机用户提供了简便的方式来选择中国的省份和城市,提升用户体验。下面将详细介绍这个jQuery插件的工作原理、特点以及如何在项目中应用。 **jQuery插件...

    jQuery 插件 表格高亮显示选中行 全选、反选(四种模式)

    在本文中,我们将深入探讨如何使用jQuery插件来实现表格中的行高亮显示以及全选、反选功能。这个插件特别适用于数据展示和交互性强的网页应用,它提供了四种不同的工作模式,使得用户可以更加方便地管理和操作表格...

    jquery全选反选插件

    本话题将深入探讨“jQuery全选反选插件”的相关知识点,这对于构建具有复选框全选和反选功能的用户界面非常有用。 首先,jQuery全选反选插件的核心功能是实现复选框的批量选择。在网页上,当用户需要对一组选项进行...

    JQuery插件之全选与反选

    在网页开发中,jQuery是一个非常流行的JavaScript库,它极大地简化了DOM操作、事件处理和动画效果。本主题将深入探讨jQuery中的"全选"与"反选"功能,这是一个常见且实用的功能,尤其是在处理多选框(Checkbox)的...

    jquery 日期 时间 插件

    - 提到的“datetimepicker”可能是参考了`Eonasdan/bootstrap-datetimepicker`,这是一个基于Bootstrap框架的jQuery插件,提供日期和时间选择功能,具有响应式设计和丰富的配置选项。 - 文件名中的...

    jQuery自定义月份选择插件

    本教程将详细讲解如何利用jQuery创建一个自定义的月份选择插件,帮助开发者提高用户体验,使得用户能方便快捷地选择日期。 首先,我们需要了解jQuery的基本用法。jQuery的核心特性是其简洁的语法,例如$(selector)....

    jquery实现 复选框 选中和不选中 美化复选框

    在网页设计中,复选框(Checkbox)是用户界面中常用的一种元素,它允许用户对多个选项...在实际项目中,可以考虑使用现成的jQuery插件,如Bootstrap的Checkbox Switch或iCheck,它们提供了更丰富的功能和自定义选项。

    jQuery下拉菜单选中搜索框插件代码

    本文将详细解析"jQuery下拉菜单选中搜索框插件代码"的相关知识点,帮助开发者理解并应用这个插件。 首先,我们要明白下拉菜单(Dropdown Menu)在网页设计中的作用。它通常用于将多个选项或子菜单隐藏在主菜单项之...

    240多个jQuery UI插件

    ### 240多个jQuery UI插件:详细知识点解析 #### 文件上传(Fileupload) - **文件上传(Fileupload)** - **文件上传插件**主要包括: - **Fileupload**: 提供了强大的文件上传功能,支持多文件上传、进度条显示等...

    前端利用jquery插件上传图片

    本篇文章将深入探讨如何利用jQuery插件实现图片上传,并关注样式优化、上传位置调整以及删除功能。 首先,我们需要了解基本的图片上传原理。在HTML5中,`&lt;input type="file"&gt;`元素允许用户选择本地文件,但默认的...

    jquery批量上传图片插件

    "jQuery批量上传图片插件"是基于jQuery实现的一种功能,旨在为网页应用提供便捷的图片批量上传功能。这个插件通常利用Ajax技术实现异步上传,即在不刷新页面的情况下,用户可以选择多张图片并将其上传到服务器,大大...

    jquery插件实现软件后台管理界面

    本主题将深入探讨如何利用jQuery插件来构建高效且用户友好的软件后台管理界面。 首先,jQuery的核心特性在于其简洁的API,使得开发者能够用更少的代码实现更多的功能。例如,通过`$(selector).action()`这样的语法...

    jquery日期插件

    **jQuery日期插件详解** jQuery日期插件是前端开发中常用的一种工具,它极大地简化了在网页中处理日期和时间的复杂性。本篇文章将深入探讨这个插件的使用方法,帮助开发者更好地理解和应用。 首先,jQuery是一个轻...

    删除文本框内容的实用jquery插件addclear.zip

    首先,jQuery插件是为扩展jQuery功能而创建的自定义代码模块。它们通常封装了一些特定的功能或行为,以便在多个项目中重复使用,提高开发效率。"addclear"插件就是这样一个例子,它的核心目标是为文本输入框(`...

Global site tag (gtag.js) - Google Analytics