/**
* 替换textarea中的选中的文字
* @param {Object} replaceStr
* @return {TypeName}
*/
var replaceText = function(replaceStr) {
var textarea = top.document.getElementById('content');
var rangeData = getCursorPosition(textarea);
if (rangeData == null) {
return;
}
var i = rangeData.start;
var all = textarea.value;
var temp1 = all.substring(0, i);
var temp2 = all.substring(i);
var temp3 = replaceStr + temp2.substring(rangeData.text.length);
textarea.value = temp1 + temp3;
}
/**
* 获取textarea中的选中的文字
* @param {Object} textarea
* @return {TypeName}
*/
var getCursorPosition = function(textarea) {
var rangeData = {
text : "",
start : 0,
end : 0
};
textarea.focus();
if (textarea.setSelectionRange) { // W3C
rangeData.start = textarea.selectionStart;
rangeData.end = textarea.selectionEnd;
rangeData.text = (rangeData.start != rangeData.end) ? textarea.value
.substring(rangeData.start, rangeData.end) : "";
} else if (top.document.selection) { // IE
var i, oS = top.document.selection.createRange(),
// Don't: oR = textarea.createTextRange()
oR = top.document.body.createTextRange();
oR.moveToElementText(textarea);
rangeData.text = oS.text;
rangeData.bookmark = oS.getBookmark();
// object.moveStart(sUnit [, iCount])
// Return Value: Integer that returns the number of units moved.
for (i = 0; oR.compareEndPoints('StartToStart', oS) < 0
&& oS.moveStart("character", -1) !== 0; i++) {
// Why? You can alert(textarea.value.length)
if (textarea.value.charAt(i) == '\n') {
i++;
}
}
rangeData.start = i;
rangeData.end = rangeData.text.length + rangeData.start;
}
if (rangeData.text == ""
|| (rangeData.text.length + 2) == textarea.value.length) {
return null;
} else {
return rangeData;
}
}
var ContentCurrentPostion=null; //记录当前位置,如果是IE记录的应该是一个rang范围,firefox则记录的是一个位置值
/**
* 记录插入位置
* @param {Object} obj
*/
var GetTextAreaPostion = function(obj){
if(document.selection){
obj.focus();
ContentCurrentPostion=document.selection.createRange();
}
else if(obj.selectionStart||obj.selectionStart=='0'){
var startPos=obj.selectionStart;
var endPos=obj.selectionEnd;
ContentCurrentPostion=new Object();
ContentCurrentPostion.startPos=startPos;
ContentCurrentPostion.endPos=endPos;
}
else{
ContentCurrentPostion=null;
}
}
/**
* 插入值
* @param {Object} value
* @param {Object} id
*/
var SetContent = function(value)
{
var str=value;
var textarea = top.document.getElementById('content');
GetTextAreaPostion(textarea);
if(ContentCurrentPostion!=null) {
textarea.focus();
if(document.selection) {
ContentCurrentPostion.text=str;
}else{
var startPos=ContentCurrentPostion.startPos;
var endPos=ContentCurrentPostion.endPos;
textarea.value = textarea.value.substring(0,startPos) + str + textarea.value.substring(endPos,textarea.value.length);
}
} else {
textarea.value+=str;
}
};
分享到:
相关推荐
然后,根据这些位置,构建新的textarea值,并更新光标位置。 此外,考虑到在插入文本时可能改变的滚动条位置,函数还保存了`scrollTop`,在插入文本后恢复滚动条位置,以保持用户的视野不变。 在HTML部分,`...
如果要在特定位置插入文本,可以先保存旧的光标位置,插入文本,然后更新光标位置: ```javascript let oldCursorPos = input.selectionStart; input.value = input.value.slice(0, oldCursorPos) + '新文本' + ...
不过,在需要跨浏览器兼容性的场景下,开发者应该尽量避免使用innerHTML属性来修改Textarea的值。 简而言之,Textarea的使用需要注意以下几点: 1. 在IE及其他浏览器中,使用innerHTML属性可能会引发兼容性问题。 2...
但是,作者也提到原生JavaScript可以达到同样的效果,因此鼓励有需要的开发者进行适当的修改。 最后,为了兼容Chrome浏览器,代码中进行了额外的判断和操作。根据Chrome浏览器的行为特点,可能需要调整获取光标位置...
### js 修改 FCK 编辑器的值 #### 背景介绍 FCKeditor(现更名为 CKEditor)是一款广泛使用的富文本编辑器,它能够为网页提供强大的文本编辑功能,支持图片插入、表格制作等多种高级操作。在 Web 开发过程中,经常...
尽管这个表达式在语法上是正确的,但它不会改变`textarea.value`的原始值,因为`replace`方法不会就地修改字符串,而是返回一个新的字符串。如果你想要替换所有`\n`,你需要赋值回`textarea.value`: ```javascript...
在Vue.js开发过程中,有时我们会遇到一个问题:直接通过JavaScript操作HTML元素的值,比如修改文本框的`value`属性,却发现这些更改并未反映到Vue的数据模型中。这是因为Vue采用的是数据驱动视图的模式,它依赖于...
文本编辑器是软件开发中常见的工具,用于创建、编辑和修改文本内容,尤其在Web开发中,它们常常被用于创建富文本,即包含多种格式如字体、颜色、图像等内容的文本。本文将深入探讨如何在文本编辑器中设置和获取值,...
### Js 获取和修改FCKeditor的值的代码详解 #### 一、概述 FCKeditor是一款功能强大的富文本编辑器,被广泛应用于Web应用程序中,为用户提供了一个接近桌面编辑器的体验。通过JavaScript,我们可以轻松地与...
总结来说,JS实现在文本指定位置插入内容的示例,演示了如何在不破坏用户界面连续性和输入连贯性的前提下,实现文本的动态修改。掌握这一技能对于前端开发者来说是十分有价值的,它广泛应用于富文本编辑器、表单输入...
唯一可见的元素是插入符号和选择(如果有)。 编辑器的内容由位于其下方的div呈现,并且其跨度可以上色并格式化为粗体,斜体,下划线,删除线等。 原生行为 由于输入以及键盘和鼠标的处理均使用本机textarea ,...
6. **插入或删除行/列**:同样在“修改”-“表格”菜单中,可以方便地增加或减少表格的行列数,以调整表格结构。 7. **格式化表格**:使用“命令”-“格式化表格”功能,可以快速统一表格的样式,如调整边框宽度、...
通过jQuery的`val`方法可以方便地在输入框中添加或修改值。 最后,为了让用户能够预览插入的表情,我们可以添加一个简单的解析函数,将输入框中的表情代码替换为对应的图片: ```javascript function parseEmojis...
ckeditor是一个免费且开源的JavaScript库,它提供了丰富的文本编辑功能,如文字样式调整、图片插入、表格绘制等,能够极大地丰富网页的交互性和美观度。为了在项目中使用ckeditor,首先需要将其添加到页面中: 1. *...
2. 在编程中,设置命令按钮无效通常通过修改控件的`Enabled`属性来实现。 3. 在Access数据库中,实体通常由记录表示,而字段代表实体的属性,表则是记录的集合。 4. CRT显示器是传统显示器类型,确实称为阴极射线管...
例如,对于`el-input`,可以直接修改`value`属性,或者使用`$refs.input.setValue('新值')`。 ```javascript document.getElementById('inputId').value = '新值'; // 或者,如果是Element UI的输入框 this.$refs....
#https 2018-01-23质检框赋值质检不可以修改标注框标明判断合格不合格状态不能修改判断统计值添加文字统计值2018-01-08音频封闭删除保存问题音频验证样音播放样音保存统计变更无效原因快捷符号插入数据保存2018-01-...
- `onAfterEdit`: 用户完成编辑一行后触发,提供编辑行的索引、行数据以及更改后的字段/值对。 6. **自定义编辑器** 通过扩展`$.fn.datagrid.defaults.editors`,我们可以自定义编辑器,如上述代码中扩展了'...
无论是获取表单元素的值、读取或修改HTML内容、测量元素的尺寸,还是获取窗口的尺寸,这些方法都能够提供便捷的途径。通过实践应用这些知识点,可以显著提高前端开发的效率,同时也有助于编写更加稳定和优化的代码。...