先看动图如下，我们就可以很清楚的知道获取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. Django Rest framework 框架

    一.开发模式: 1. 普通开发方式(前后端放在一起写) 2. 前后端分离(前后台通过ajaxo交互) 后端(django rest framework写的) <----ajaxo---> ...

  2. 连接mysql 出现 1005 error(150) ， error(121)的错误

    1.显示不能创建表 出现150错误 将检查是因为 我的user 表示拷贝过来的所以它设置的编码格式是utf-8 而我又新创建的表没有添加编码格式,所以它认为这两个关联的表之间的编码格式不匹配. 2.出 ...

  3. kprobe原理解析

    参考  http://www.cnblogs.com/honpey/p/4575928.html kprobe是linux内核的一个重要特性,是一个轻量级的内核调试工具,同时它又是其他一些更高级的内核 ...

  4. 在Hmtl页面中只让其中单独的一个div隐藏滚动条但是仍可滚动浏览下边的内容

    <style> .box ::-webkit-scrollbar {width: 0px;} </style> <div class="box"> ...

  5. PLSQL 错误问题：ora-12154:TNS:could not resolve the connect identifier

    错误问题: ORA-12154: TNS:could not resolve the connect identifier specified 即无法解析指定的连接,这说明缺少了一个环境变量,TNS_ ...

  6. python绝对路径和相对路径

    转自https://blog.csdn.net/databatman/article/details/49453953 下面的路径介绍针对windows,其他平台的暂时不是很了解. 在编写的py文件中 ...

  7. Codeforces#543 div2 A. Technogoblet of Fire(阅读理解)

    题目链接:http://codeforces.com/problemset/problem/1121/A 真·阅读理解 题意就是 有n个人 pi表示他们的强度 si表示他们来自哪个学校 现在Arkad ...

  8. AMD三代锐龙箭在弦上：如此家族堪称豪华

    AMD将于今年年中正式推出第三代Ryzen锐龙处理器,即不集成显示芯片的纯CPU产品,外界猜测可能的时间点会是5月底的台北电脑展. 虽说依然采用AM4接口,也就是X370/470老主板可无压力兼容,但 ...

  9. 实现中英文混合string的逆向输出

    #include <iostream> using namespace std; // 输入一个字符串(包括英文和中文),将其反序输出, 如: // hello 今天真热 ---> ...

  10. Java WEB 乱码解决大全

    来自 http://ligure.iteye.com/blog/ 中文乱码:在以后学习过程中全部采用UTF-8 1.文件的乱码 1.1.项目文本文件默认编码:        [右击项目]->[P ...