插入textarea | JavaScript的

时间:2010-05-26 21:50:59

标签: javascript dom textarea

我正在尝试在编辑textarea值时插入图像url所在的位置。

function addImageURL()
{
 var imageurl = prompt("Enter image URL", "Your name")
 var post = document.getElementById("message-put").value;

 document.getElementById('message-put').value = post + '[img]' + imageurl + '[/img]';
}

这段代码抓住了里面的值,在它旁边添加了我不想要的图片网址,我需要把它插入到编辑textarea时点的位置

由于

编辑:

与Stackoverflow一样,您可以看到图像图标,单击它或单击超链接,会出现一个框并将其插入您编辑textarea的位置:P

alt text http://i45.tinypic.com/eqa7m8.png

3 个答案:

答案 0 :(得分:1)

如果你想在光标处插入一些东西,我可以使用Googlez找到这些东西:

function insertAtCaret(areaId, text) {
    var txtarea = document.getElementById(areaId);
    var scrollPos = txtarea.scrollTop;
    var strPos = 0;
    var br = ((txtarea.selectionStart || txtarea.selectionStart == '0') ? "ff" : (document.selection ? "ie" : false ) );

    if (br == "ie") {
        txtarea.focus();
        var range = document.selection.createRange();
        range.moveStart('character', -txtarea.value.length);
        strPos = range.text.length;
    } else if (br == "ff") strPos = txtarea.selectionStart;

    var front = (txtarea.value).substring(0, strPos);
    var back = (txtarea.value).substring(strPos, txtarea.value.length);

    txtarea.value = front + text + back;
    strPos = strPos + text.length;

    if (br == "ie") {
        txtarea.focus();
        var range = document.selection.createRange();
        range.moveStart('character', -txtarea.value.length);
        range.moveStart('character', strPos);
        range.moveEnd('character', 0);
        range.select();
    } 

    else if (br == "ff") {
        txtarea.selectionStart = strPos;
        txtarea.selectionEnd = strPos;
        txtarea.focus();
    }

    txtarea.scrollTop = scrollPos;
}

来源:http://www.scottklarr.com/topic/425/how-to-insert-text-into-a-textarea-where-the-cursor-is/(我没有测试过这个;它是从2008年开始的,所以它可能有点过时了。)

答案 1 :(得分:0)

我想你可能会在这里找到你想要的东西:

Caret position in textarea, in characters from the start

这里有一个示例实现:

http://javascript.nwbox.com/cursor_position/

答案 2 :(得分:0)

我在尝试在WYSIWYG中实现类似功能时使用的一种技术:

Retrieve parent node from selection (range) in Gecko and Webkit » StackOverflow

如果使用框架,或者想避免遇到一些光标问题,可能会有用。