js 实现光标控制与字符串查找
转载请注明来源:https://www.cnblogs.com/hookjc/
光标定位:
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=gb2312">
<meta name="generator" content="microsoft frontpage 4.0">
<meta name="progid" content="frontpage.editor.document">
<title>光标位置</title>
<style>
input{border: 1 solid #000000}
body,table{font-size: 10pt}
</style>
</head>
<body>
<table border="0" width="700" cellspacing="0" cellpadding="0">
<tr>
<td width="479" rowspan="7">
点击 textarea 实现光标定位
<p>
<textarea rows="7" cols="49" id="box" onclick=tellpoint()>我怕来不及我要抱着你,直到感觉你的绉纹有了岁月的痕迹,直到视线变得模糊直到不能呼吸
为了你我愿意
动也不能动也要看着你,直到感觉你的发线有了白雪的痕迹,直到肯定你是真的直到失去力气让我们形影不离
如果全世界我也能放弃,至少更有你值得我去珍惜而你在这里就是生命的奇迹
也许全世界我也能忘记,就是不愿意失去你的消息你掌心的痣我总记得在哪里
我们好不容易我们身不由已,我怕时间太快不够将你看仔细,我怕时间太慢日夜担心失去你恨不得一夜之间白头永不分离
</textarea>
<script>
function movepoint()
{
var pn = parseInt(pnum.value);
if(isNaN(pn))
return;
var rng = box.createTextRange();
rng.moveStart("character",pn);
rng.collapse(true);
rng.select();
returncase(rng);
}
function tellpoint()
{
var rng = event.srcElement.createTextRange();
rng.moveToPoint(event.x,event.y);
rng.moveStart("character",-event.srcElement.value.length);
pnum.value = rng.text.length;
returncase(rng);
}
function returncase(rng)
{
bh.innerText = rng.boundingHeight;
bl.innerText = rng.boundingLeft;
bt.innerText = rng.boundingTop;
bw.innerText = rng.boundingWidth;
ot.innerText = rng.offsetTop;
ol.innerText = rng.offsetLeft;
t.innerText = rng.text;
}
function selecttext(sp,ep)
{
sp = parseInt(sp);
ep = parseInt(ep);
if(isNaN(sp)||isNaN(ep))
return;
var rng = box.createTextRange();
rng.moveEnd("character",-box.value.length);
rng.moveStart("character",-box.value.length);
rng.collapse(true);
rng.moveEnd("character",ep);
rng.moveStart("character",sp);
rng.select();
returncase(rng);
}
function findtext(tw)
{
sw = document.selection.createRange().text.length;
var rg = box.createTextRange();
rg.moveEnd("character",box.value.length);
rg.moveStart("character",sw);
if(rg.findText(tw))
{
rg.select();
returncase(rg);
}
if(rg.text!=tw)
{
alert("已搜索完成,未发现此内容")
rg = box.createTextRange()
}
}
</script>
</p>
<p></p>
光标位置:<input type="text" value="0" id="pnum" size="8"> <input type="button" onClick="movepoint()" value="移动光标到指定位置">
<p></p>
选择指定范围:<input type="text" size="9" id="sbox"> -- <input type="text" size="9" id="ebox"> <input type="button" onClick="selecttext(sbox.value,ebox.value)" value="选择">
<p></p>
选择查找字符 :<input type="text" value="" id="cbox" size="8"> <input type="button" onClick="findtext(cbox.value)" value="查找下一个并选择">
</td>
<td width="217">boundingheight: <span id="bh"></span></td>
</tr>
<tr>
<td width="217">boundingwidth: <span id="bw"></span></td>
</tr>
<tr>
<td width="217">boundingtop: <span id="bt"></span></td>
</tr>
<tr>
<td width="217">boundingleft: <span id="bl"></span></td>
</tr>
<tr>
<td width="217">offsetleft: <span id="ol"></span> </td>
</tr>
<tr>
<td width="217">offsettop: <span id="ot"></span> </td>
</tr>
<tr>
<td width="217">text: <span style="position: absolute; z-index: 10" id="t"></span> </td>
</tr>
</table>
</body>
</html>
来源:python脚本自动迁移
js 实现光标控制与字符串查找的更多相关文章
- js与java正则表达式处理字符串问题
在编写处理字符串的程序或网页时,经常会有查找符合某些复杂规则的字符串的需要.正则表达式就是用于描述这些规则的工具.换句话说,正则表达式就是记录文本规则的代码.合理使用正则表达式确实会为程序员省去很多字 ...
- js获取光标位置
js获取光标位置 var TT = { /* * 获取光标位置 * @Method getCursorPosition * @param t element * @return number */ ...
- TCHAR字符串查找&反向查找字符串
C++支持两种字符串,即常规的ANSI编码("字符串")和Unicode编码(L"字符串"),相应的就有两套字符串处理函数,比如:strlen和wcslen,分 ...
- Rabin-Karp指纹字符串查找算法
首先计算模式字符串的散列函数, 如果找到一个和模式字符串散列值相同的子字符串, 那么继续验证两者是否匹配. 这个过程等价于将模式保存在一个散列表中, 然后在文本中的所有子字符串查找. 但不需要为散列表 ...
- 自己动手写文件查找,字符串查找,查询jar包等工具
文件查找——搜索当前目录下的文件 知道大概的文件名称,使用 findf FileName findf.py import argparse, re, os from os.path import jo ...
- 关于字符串查找 charindex ,Patindex 还有一个like
字符串查找.在模糊朝找的情况下,其实3者的效率是差不多的.都需要一个一个取出来然后扫一遍╮(╯_╰)╭.然而用法还是会有一点儿的区别 1 charindex (查找的字符串,字符串表达式[,开始查找的 ...
- 使用Js脚本 修改控制IE的注册表相关设置(activex等)
使用Js脚本 修改控制IE的注册表相关设置(activex等) 分类: PHP2012-12-05 18:51 2035人阅读 评论(2) 收藏 举报 脚本写法: <SCRIPT LANGUAG ...
- python 字符串查找
python 字符串查找有4个方法,1 find,2 index方法,3 rfind方法,4 rindex方法. 1 find()方法: )##从下标1开始,查找在字符串里第一个出现的子串:返回结果3 ...
- js如何将纯数字字符串转换为long型
1.js如何将纯数字字符串转换为long型? js 中 int的存储位数?最大十进制数表示是多少? 精度http://www.jb51.net/article/59808.htm 整数(不使用小数点或 ...
随机推荐
- # 中文NER的那些事儿6. NER新范式!你问我答之MRC
就像Transformer带火了"XX is all you need"的论文起名大法,最近也看到了好多"Unified XX Framework for XX" ...
- 为什么操作dom会消耗性能
因为对DOM的修改为影响网页的用户界面,重绘页面是一项昂贵的操作.太多的JavaScript DOM操作会导致一系列的重绘操作,为了确保执行结果的准确性,所有的修改操作是按顺序同步执行的.我们称这个过 ...
- Django admin实现TextField字段changelist页面换行、空格正常显示
问题背景 在Django后台的使用admin view绑定model后,可以很方便的通过网页对底层的数据表进行增删查改操作. 在实际工作中有一些数据字段会存储了json或者其他包含换行符.空格符的文本 ...
- Hadoop组件启停命令和服务链接汇总
1.启停命令 Zookeeper zkServer.sh start zkServer.sh stop/status/restart zkCli.sh -server IP:Port Hadoop(h ...
- oracle 之 数组、嵌套表、SQL查询式 实现多表数据for循环插入指定表
1.基础环境 创建基础表: CREATE TABLE TEST_TAB1( ID INT, NAME VARCHAR2(20) ); CREATE TABLE TEST_TAB2( ID INT, N ...
- 遍历hashmap的6种方法
1. 通过ForEach循环进行遍历 mport java.io.IOException; import java.util.HashMap; import java.util.Map; public ...
- c#多进程通讯,今天,它来了
引言 在c#中,可能大多数人针对于多线程之间的通讯,是熟能生巧,对于AsyncLocal 和ThreadLocal以及各个静态类中支持线程之间传递的GetData和SetData方法都是信手拈来,那多 ...
- python极简教程04:进程和线程
测试奇谭,BUG不见. 大家好,我是谭叔. 这一场,主讲python的进程和线程. 目的:掌握初学必须的进程和线程知识. 进程和线程的区别和联系 终于开始加深难度,来到进程和线程的知识点~ 单就这两个 ...
- Docker入门篇(一)安装docker
Docker入门篇(一)安装docker Docker的来源 由dotCloud公司首创及正式命名,但是企业规模小,影响力不够,所以在快要坚持不住的时候,开始吃百家饭--开源了.不开则已,一开惊人.越 ...
- WEB开发的相关知识(Tomcat)
Internet上供外界访问的Web资源分为 静态web资源(如html 页面):指web页面中供人们浏览的数据始终是不变. 动态web资源:指web页面中供人们浏览的数据是由程序产生的,不同时间点访 ...