`

javascript实现textarea中光标处插入字符的实现[兼容ie和firefox](来自网络)

 
阅读更多

 因项目需要,需要在多行文本框中的光标位置插入字符,利于js的 document.selection属性很快就实现,但发现在firefox中无法兼容selection属性,网上找了很久也没有找到合适的方法,经过研究,改出了兼容ie和FF的完美解决方案
代码如下:

<!-- Code highlighting produced by Actipro CodeHighlighter (freeware) http://www.CodeHighlighter.com/ -->function AddText(str) { var ubb=document.getElementById("TxtContent"); var ubbLength=ubb.value.length; ubb.focus(); if(typeof document.selection !="undefined") { document.selection.createRange().text=str; } else { ubb.value=ubb.value.substr(0,ubb.selectionStart)+str+ubb.value.substring(ubb.selectionStart,ubbLength); } }

例如:

<!-- Code highlighting produced by Actipro CodeHighlighter (freeware) http://www.CodeHighlighter.com/ -->function Underline() { var tUnderline=prompt("请输入要设置的下划线文字\n标签:[u][/u]","") if(tUnderline==""|| tUnderline==null) { return; } tUnderline="[u]"+tUnderline+"[/u]" AddText(tUnderline); }

HTML部分:

<!-- Code highlighting produced by Actipro CodeHighlighter (freeware) http://www.CodeHighlighter.com/ --><a href="javascript:Underline();void(0)"><img src="Images/Style/underline.gif" alt="下线线" border="0"/></a>

注:1、TxtContent为textarea的ID,函数str参数为要插入的字符
2、在ie6.0和FF2.0中调试通过!!   

分享到:
评论

相关推荐

    通过javascript在光标处插入文本

    Firefox、Chrome等现代浏览器支持`selectionStart`和`selectionEnd`属性,可以直接获取光标位置。而IE浏览器则需要使用`document.selection`对象来获取光标位置。 在我们的示例代码中,我们使用了以下代码来获取...

    textbox 在光标位置插入字符功能的js实现(兼容ie,firefox)

    在JavaScript中,实现一个在文本框(`&lt;textarea&gt;`)中光标位置插入字符的功能,需要考虑到不同浏览器的兼容性问题。主要涉及到两种主要的浏览器:Internet Explorer (IE) 和非IE浏览器,如Firefox。IE浏览器使用的是...

    JS在textarea光标处插入文本的小例子

    标题“JS在textarea光标处插入文本的小例子”和描述“本实例使用Javascript实现在textarea光标处插入文本,支持多种浏览器”揭示了该文档是关于如何使用JavaScript在网页文本区域(textarea)组件光标所在位置插入...

    js操作textarea方法集合封装(兼容IE,firefox)

    需要注意的是,在实现以上方法时,测试了包括IE6, IE8, Firefox, Chrome, Opera和Safari在内的多种浏览器,并声明兼容性没有问题。特别指出,在Firefox中,当添加字符串时,滚动条的scrollTop可能异常地被置为0。这...

    js实现在文本框光标处添加字符的方法介绍

    在JavaScript编程中,有时我们需要实现一个功能,即在用户输入的文本框(input[type="text"] 或 textarea)的光标位置动态插入特定字符。这在创建富文本编辑器、在线表单或者任何需要用户交互输入的场景中非常常见。...

    jQuery实现在textarea指定位置插入字符或表情的方法

    - 对于现代浏览器(如Firefox、Chrome等)支持的`selectionStart`和`selectionEnd`属性,我们需要获取当前的起始和结束选择位置,然后插入`myValue`到选定的位置。同时,我们还需要保存和恢复textarea的滚动位置,...

    jQuery插件 文本框、文本域 光标处插入代码

    5. **兼容性**:考虑到不同的浏览器可能有不同的实现,插件需要确保在主流浏览器上都能正常工作,比如Chrome、Firefox、Safari和IE。 6. **用户界面**:可能还需要提供一个友好的用户界面,让用户可以方便地选择...

    JS在TextArea光标位置插入文字并实现移动光标到文字末尾

    在JavaScript中,对文本框(TextArea)进行操作是常见的需求,比如在光标位置插入文字并把光标移动到新插入文字的末尾。这里主要涉及两种浏览器环境下的处理方式:IE和其他现代浏览器(Firefox, Chrome, Safari, ...

    获取div编辑框,textarea,input text的光标位置 兼容IE,FF和Chrome的方法介绍

    在网页开发中,常常需要获取用户在输入框...总体而言,通过上述方法,开发者可以实现在不同浏览器中获取div编辑框、textarea和input text光标位置的功能,并确保这些功能在IE、Firefox和Chrome等主流浏览器中正常工作。

    javascript在一段文字中的光标处插入其他文字

    通过以上介绍和示例代码,我们可以清晰地了解到如何使用JavaScript实现在一段文字中的光标处插入其他文字的功能。这种方法不仅提高了用户体验,还增加了应用程序的功能性。开发者可以根据实际需求调整代码逻辑,以...

    javascript获得光标所在的文本框(text/textarea)中的位置

    在非IE浏览器中,如Firefox、Chrome等,我们可以使用`selectionStart`属性来获取光标的位置。`selectionStart`返回的是光标在文本框中开始选择的字符索引,如果未进行任何选择,那么它就代表了光标所在的位置。 在...

    javascript控制在光标位置插入文字适合表情的插入

    而在不支持document.selection的浏览器(如Firefox,Chrome等),则需要利用selectionStart和selectionEnd属性来获取选区的起始和结束位置,并通过字符串拼接的方式来实现插入。 以下是详细步骤说明: 1. 获取...

    将光标定位到textarea的某一行的javascript代码

    对于其他非IE浏览器,如Firefox、Chrome等,可以使用`setSelectionRange()`或`selectionStart`和`selectionEnd`属性来实现相同的功能。不过,这些方法在跨浏览器兼容性上会有所不同,所以在实际开发中,可能需要使用...

    js操作textarea 常用方法总结

    本文将总结一些常用的JavaScript操作textarea的方法,这些方法可以在各种主流浏览器中使用,并通过实际测试验证了兼容性,包括IE6、IE8、Firefox、Chrome、Opera和Safari。 首先,需要了解textarea元素在DOM中的...

    JQuery在光标位置插入内容的实现代码

    JQuery提供了一个方便的方法来实现这一功能,特别是考虑到不同浏览器之间的兼容性问题,例如IE和Firefox的差异。本文将详细解释如何使用JQuery在光标位置插入内容,并展示实现代码。 首先,我们了解不同浏览器处理...

    获取和设置输入框光标位置的插件

    5. **兼容性**:良好的插件会确保其在各种浏览器(包括主流的Chrome、Firefox、Safari、Edge以及旧版本的IE)中都能正常工作。 6. **事件监听**:插件可能还提供监听光标位置变化的事件,帮助开发者在光标移动时...

    js封装的textarea操作方法集合(兼容很好)

    它能够处理在IE浏览器和非IE浏览器(如Firefox)两种情况下,如何获取光标在textarea中的位置。这个方法对于需要动态获取用户输入位置的应用非常有用,例如在开发富文本编辑器时。 2. setCursorPosition:设置光标...

    Javascript实现获取及设置光标位置的方法

    由于不同浏览器(如IE、Firefox、Opera等)的实现方式不同,开发者需要了解如何兼容不同的浏览器以实现这一功能。Javascript提供了操作页面元素光标位置的API,让我们可以获取光标当前所在位置,并能够设置光标到...

    往光标所在位置插入值的js代码

    在JavaScript中,向输入域(例如文本框或文本区域)的光标所在位置插入字符串是一项常见的操作,这对于实现各种功能,如自动补全、格式化输入等非常有用。本篇文章将详细讲解如何利用JavaScript实现这一功能。 首先...

Global site tag (gtag.js) - Google Analytics