html⾃定义实现⽂本编辑器,⾃定义开发富⽂本编辑器
(Javascript实现点击插⼊内容。。。
富⽂本编辑器相信很多程序员都⽤过,但是如何⾃⼰制作⼀个仿富⽂本的编辑器来解决⼀些简单的或⾃定义的需求呢?下⾯给⼤家共享⼀个使⽤JavaScript实现在textarea光标处插⼊指定⽂本内容以及字符串。
点击按钮,可以把按钮的内容插⼊到textarea⽂本框内光标处,光标默认在⽂本框开头。
通过其他的js就可以实现⽂本框插⼊表情、选中⽂字加粗、内容中插⼊图⽚等等。
HTML代码:
这是测试内容,请在任意位置插⼊内容。
这是测试内容,请在任意位置插⼊内容。
这是测试内容,请在任意位置插⼊内容。
这是测试内容,请在任意位置插⼊内容。
这是测试内容,请在任意位置插⼊内容。
这是测试内容,请在任意位置插⼊内容。
这是测试内容,请在任意位置插⼊内容。
这是测试内容,请在任意位置插⼊内容。
这是测试内容,请在任意位置插⼊内容。
这是测试内容,请在任意位置插⼊内容。
这是测试内容,请在任意位置插⼊内容。
这是测试内容,请在任意位置插⼊内容。
Javascript代码:
var text = ElementById('text');
var insert = ElementById('insert');
insertAtCursor(text, this.innerHTML);
};
function insertAtCursor(myField, myValue) {
if (document.selection) {
//IE support
myField.focus();
sel = ateRange();
< = myValue;
sel.select();
} else if (myField.selectionStart || myField.selectionStart == '0') {
//MOZILLA/NETSCAPE support
var startPos = myField.selectionStart;
var endPos = myField.selectionEnd;
var beforeValue = myField.value.substring(0, startPos);
asp富文本编辑器var afterValue = myField.value.substring(endPos, myField.value.length); myField.value = beforeValue + myValue + afterValue;
myField.selectionStart = startPos + myValue.length;
myField.selectionEnd = startPos + myValue.length;
myField.focus();
} else {
myField.value += myValue;
myField.focus();
}
}

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。