javascript - 突出显示文本区域中的文本时，HTML 在 Oracle Apex 中显示为文本

Question

我要求用户在文本区域中将文本突出显示为蓝色。

html 不会应用于文本区域，而是作为文本打印。

有人遇到过并克服过这个问题吗？

谢谢。

这是我正在使用的代码:

function ModifySelection () {
        var textarea = document.getElementById("P85_30DAY");
        if ('selectionStart' in textarea) {
                // check whether some text is selected in the textarea
            if (textarea.selectionStart != textarea.selectionEnd) {
                //var newText = textarea.value.substring (0, textarea.selectionStart) + 
                 //   "[start]" + textarea.value.substring  (textarea.selectionStart, textarea.selectionEnd) + "[end]" +
                  //  textarea.value.substring (textarea.selectionEnd);
                  var opnSpan = '<span style="color:white;background-color:blue">';
                  var clseSpan = '</span>';
                  var begText = textarea.value.substring (0, textarea.selectionStart);
                  var endText = textarea.value.substring (textarea.selectionEnd);
                  var selText = opnSpan + textarea.value.substring  (textarea.selectionStart, textarea.selectionEnd) + clseSpan;

                //$("#P85_30DAY").html("<span>" + begText + "<span style='color:white;background-color:blue'> " + selText + "</span>" + endText + "</span>"); //appears as text   
                // textarea.value = begText + selText + endText; //appears as text                    
                $("#P85_30DAY").val(begText + selText + endText); //appears as text


            }
        }
        else {  // Internet Explorer before version 9
                // create a range from the current selection
            var textRange = document.selection.createRange ();
                // check whether the selection is within the textarea
            var rangeParent = textRange.parentElement ();
            if (rangeParent === textarea) {
                textRange.text = "[start]" + textRange.text + "[end]";
            }
        }
    }
document.getElementById("P85_30DAY").onkeyup = ModifySelection;
document.getElementById("P85_30DAY").onmouseup = ModifySelection;

这是我试图突出显示文本的元素的 html:

<textarea name="p_t07" class="textarea" id="P85_30DAY" style="width: 587px; height: 600px; font-size: 130%; margin-top: -431px; margin-left: -1340px; position: relative;" contenteditable="true" maxlength="4000" rows="1" cols="80" wrap="virtual"></textarea>

Answer 1

您不能在 textarea 内使用 HTML。它是一个输入字段，会将其中的任何内容呈现为纯文本。

相反，请查看 ContentEditable这将允许您在可编辑元素内呈现 HTML。