版权声明:可以任意转载,转载时请务必以超链接形式标明文章原始出处http://xinyistudio.vicp.net/和作者信息及本声明
(接上文)<?xml:namespace prefix = o ns = "urn:schemas-microsoft-com:office:office" />
在函数的最后结尾处设置文本框聚焦,以便用户敲入的字符可以代替选择的文本。
function textboxSelect (oTextbox, iStart, iEnd) {
switch(arguments.length) {
case 1:
oTextbox.select();
break;
case 2:
iEnd = oTextbox.value.length;
/* falls through */
case 3:
if (isIE) {
var oRange = oTextbox.createTextRange();
oRange.moveStart("character", iStart);
oRange.moveEnd("character", -oTextbox.value.length + iEnd);
oRange.select();
} else if (isMoz){
oTextbox.setSelectionRange(iStart, iEnd);
}
}
oTextbox.focus();
}
Ø 替换文本框中选择的文本(译者注:该功能似乎用处不大,读者直接跳过)
-----------
另一项任务是我们需要用一些其它的文本来替换当前选择的文本,为此,创建了textboxReplaceSelect() 方法,它有两个参数:作用于的文本框对象和要插入的文本。在这里我们要用到TextRange对象,我们需要为IE和Mozilla建立不同的代码,让我们先给出IE的代码:
function textboxReplaceSelect (oTextbox, sText) {
if (isIE) {
var oRange = document.selection.createRange();
oRange.text = sText;
oRange.collapse(true);
oRange.select();
} else if (isMoz) {
...
}
oTextbox.focus();
}
在上面的第4行,从文档当前选择区创建了TextRange对象(可以设想一下在文本框中,由onkeypress事件触发调用),随后的一行我们用给定的字符串替换在选择范围中的文本,在第6行中,调用了TextRange对象的collapse方法,设置选择范围的宽度为0;其中的布尔型参数如果是true,光标会偏向选择范围的结束处,反之。最后,我们用select() 方法将光标确定在选择范围的结束处。
在Mozilla浏览器中利用string对象的一些简单操作来完成相同的效果。我们可以用文本框对象的selectionStart和selectionEnd属性来确定选择的起始和结束点:
function textboxReplaceSelect (oTextbox, sText) {
if (isIE) {
var oRange = document.selection.createRange();
oRange.text = sText;
oRange.collapse(true);
oRange.select();
} else if (isMoz) {
var iStart = oTextbox.selectionStart;
oTextbox.value = oTextbox.value.substring(0, iStart) + sText + oTextbox.value.substring(oTextbox.selectionEnd, oTextbox.value.length);
oTextbox.setSelectionRange(iStart + sText.length, iStart + sText.length);
}
oTextbox.focus();
}
在上面的第9行,保存了选择的起始点,第10行看起来挺费解的,事实上这行代码只是用于得到所选择文本前、后的字符串,并在它们之间添加要替换的字符串文本。
接下来的一句代码是需要纠正一下光标在文本后的位置――开始点位置加上所替换文本的长度。
Ø 匹配
―――――――――
下步需要处理的是写一个方法:给定的一个字符串A,在一个string数组中搜索并返回起始处使用了这个字符串A的第一个字符串值B(例如:通过’a’在string数组中查找起始位置使用”a”的字符串值”abcd”)。这个方法的名称是autocompleteMatch(), 它有两个参数:需要匹配的文本和被匹配的所有文本值的数组。
直接搜索――反复地检查数组中的每个值。方法返回以true的形式返回一个值,否则如果没有匹配的值找到,将返回null。全部代码如下:
function autocompleteMatch (sText, arrValues) {
for (var i=0; i < arrValues.length; i++) {
if (arrValues[i].indexOf(sText) == 0) {
return arrValues[i];
}
}
return null;
}
需要注意的是:为保证这函数能够正确工作,你应该将数组中的字符串按字母排序。
(一) (二)(三)
分享到:
相关推荐
JavaScript实现文本框提示 JavaScript实现文本框提示 JavaScript实现文本框提示 JavaScript实现文本框提示
自动在文本框提示信息自动在文本框提示信息自动在文本框提示信息自动在文本框提示信息 jquery
JavaScript按钮类一个按钮完成对文本框内容的copy和复制
JavaScript 文本框下拉提示,可以自己添加数据
如何让文本框内的提示信息在激活文本框时清空 解决思路: 当需要填写的文本框很多时,在每个文本框内写上提示信息是个不错的办法,但这样一来用户在填写该项时必须先把提示文本删掉,非常不方便。所以应该让文本框更...
JavaScript文本框提示插件placeholder
最近,我使用纯Javascript实现了一个批量修改文本框中的数据的功能,拖动鼠标即可选择页面上(包括GridView中)多个文本框,然后会自动弹出对话框要求用户输入新值。实现方法对TextBox没有侵入性,也不需要修改现有...
QQ密码强度判断,javascript 代码自动判断文本框中的密码强度
JavaScript,HTML建立一个简单界面,要求文本框中只能输入字母.这是网上常见的实验指导书里面的作业,个人练习捣鼓出来的东西,希望对小白们有所帮助
纯javascript实现副文本框 ,实用
javascript动态增加文本框 点击按钮,可以直接增加文本框,动态实现,不跳转页面,也不刷新原页面.
javascript 文本框下拉提示与cookie应用实例
可以动态的添加 删除 文本框!代码几乎不用修改就直接能用,简单方便
主要介绍了js实现鼠标点击文本框自动选中内容的方法,涉及javascript鼠标点击事件onClick及选择事件select的使用技巧,非常简单实用,需要的朋友可以参考下
javascript日期输入文本框 源代码
JavaScript鼠标点到文本框时的提示信息 JavaScript鼠标点到文本框时的提示信息 JavaScript鼠标点到文本框时的提示信息
html javascript jquery 文本框水印 调用简单,不影响asp.net验证控件
NULL 博文链接:https://back-888888.iteye.com/blog/1048180
JavaScript 制作带自动提示的文本框,需要的朋友可以参考下。
Javascript实现的网页文本框输入提示 实现原理: 文本框输入内容后,搜索字符串数组,将匹配内容写入DIV以下拉列表形式展现,并支持方向键选择,效果类似搜索网站的输入提示。 友情提示: 较为粗糙的实现方法,...