先看动图如下,我们就可以很清楚的知道获取input标签中光标的索引的意思了。



由于IE支持document.selection,Firefox,Chrome,Safari以及Opera都有selectionStart和selectionEnd属性

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<link rel="stylesheet" href="">
</head>
<body>
<script>
function getTxt1CursorPosition(){
var oTxt1 = document.getElementById("txt1");
var cursurPosition=-1;
if(oTxt1.selectionStart){//非IE浏览器
cursurPosition= oTxt1.selectionStart;
}else{//IE
var range = document.selection.createRange();
range.moveStart("character",-oTxt1.value.length);
cursurPosition=range.text.length;
}
alert(cursurPosition);
}
</script>
<input type="text" id="txt1" value="abcde" onclick="getTxt1CursorPosition()"> </body>
</html>

本文转载自:https://www.cnblogs.com/xiaoyang002/p/4055716.html

有趣的js获取input标签中光标的索引的更多相关文章

  1. javascript笔记——js获取input标签中光标的索引

    出处:http://www.cnblogs.com/MrZouJian/p/5850553.html function getTxt1CursorPosition(){ var oTxt1 = doc ...

  2. 网站开发进阶(十八)js获取html标签中的值

    js获取html标签中的值 项目开发过程中,由于需求所迫,需要获取html标签元素中的内容,下面做一简单总结.以下所讲的示例适用于其它标签元素. 主要包括2中方法获取元素内容: 方法一:.innerT ...

  3. JQ和Js获取span标签的内容

    JQ和Js获取span标签的内容 html: 1 <span id="content">‘我是span标签的内容’</span> javascript获取: ...

  4. js 获取input type="file" 选择的文件大小、文件名称、上次修改时间、类型等信息

    文件名的传递 ---全路径获取 $('#file').change(function(){ $('#em').text($('#file').val()); }); 文件名的传递 ---只获取文件名 ...

  5. js获取input上传文件名和后缀

    var file = $("#filedata").val(); var pos = file.lastIndexOf("\\");  var filename ...

  6. 使用JS获取input值

    获取input值,设置input值 可以使用 $(".class") $("#id") $("input[name='name']") re ...

  7. 如何获取Input标签自定义属性的值?

    HTML代码: <input type="hidden" value="${Name?if_exists}" id='ID' busCode = &quo ...

  8. js 获取输入框中光标的索引位置

    <html> <head></head> <body> <script> function getTxt1CursorPosition(){ ...

  9. 获取input标签的所有属性

    1.用jquery$("input[name='btnAdd']").attr("value") 获取value属性值,其它属性换attr的参数就OK 例1: ...

随机推荐

  1. python爬虫-1

    import resquests #import urllib.request from bs4 import BeautifulSoup from collections import Ordere ...

  2. Swagger2常用注解及其说明 (转)

    Api 用在Controller中,标记一个Controller作为swagger的文档资源 属性名称 说明 value Controller的注解 description 对api资源的描述 hid ...

  3. 安装VC++2015运行库时出现0x80240037错误

    很多时候,当我们将开发好的软件部署到用户的机器上时总会出现各种意想不到的错误,最近在一台原版Windows7系统的电脑上安装VC++运行库的时候,莫名的出现安装失败,然后错误代码为:0x8024003 ...

  4. 微信小程序支付功能

    API:wx.requestPayment() { } https://blog.csdn.net/qishubiao/article/details/80804052

  5. Python——FTP上传和下载

    一.FTP对象方法说明 login(user='anonymous',passwd='', acct='') 登录 FTP 服务器,所有参数都是可选的 pwd() 获得当前工作目录 cwd(path) ...

  6. Git——取消merge状态

    MERGING状态 取消MERGING 查看更新历史 $ git reflog 恢复之前状态 $ git reset --hard 06a5578

  7. HUST 1555 数学作业

    参考自:https://www.cnblogs.com/ECJTUACM-873284962/p/6394892.html 1555 - A Math Homework 时间限制:1秒 内存限制:12 ...

  8. POJ 2352 树状数组

    学习自:链接以及百度百科 以及:https://www.bilibili.com/video/av18735440?from=search&seid=363548948825132979 理解 ...

  9. SHELL 脚本小技巧

    脚本很简单,直接上功能介绍及脚本,可以做模板使用: 记录日志,记录脚本开始执行时间.结束时间 usage 函数,脚本需接参数执行,避免误执行,告诉用户,这个脚本的使用方法 加锁,创建锁文件,脚本不允许 ...

  10. Hdoj 2454.Degree Sequence of Graph G 题解

    Problem Description Wang Haiyang is a strong and optimistic Chinese youngster. Although born and bro ...