替换表单输入选定的文本答案

【问题标题】：Replace Form Input Selected Text替换表单输入选定的文本
【发布时间】：2022-10-01 00:36:28
【问题描述】：

我有一个旧的 asp 页面，其中有一个小图像，可以单击该图像以使用 javascript 将表单文本输入框中的某些选定文本更改为斜体。这多年来一直运行良好，但一位用户刚刚告诉我它似乎不再工作了。在寻找解决方案时，似乎许多当前浏览器不再支持 createRange() 函数，导致浏览器抛出错误，现在应该使用 getSelection() 代替。

下面列出了旧脚本。

<script type=\"text/javascript\">
var j;  // this is the currently selected form element i.e., line number

function getelement_num(k) {
    j = k;
    return;
}
function format_sel(v) {
  var str = document.selection.createRange().text;
  document.form1.strMessage.focus();
  var sel = document.selection.createRange();
  sel.text = \"[\" + v + \"]\" + str + \"[/\" + v + \"]\";
  return;
}
</script>

我已将 format_sel 函数修改如下：

function format_sel(v) {
    var str = window.getSelection().toString;
    document.FrontPage_Form2.elements[j].focus();
    var sel = window.getSelection().toString;
    sel.text = \"<\" + v + \">\" + str + \"</\" + v + \">\";
return;
}

因此， getSelection() 似乎工作正常。如果我提醒（sel），它会返回选定的文本。但是， sel.text 部分不会替换表单输入字段中的选定文本。

我的问题是，我应该如何修改上面的代码，以便将表单输入字段中的选定文本替换为在 sel.text 中找到的修改后的文本？

相关的 HTML 代码（为简洁起见，仅显示 9 个表单字段中的 1 个）：

<a title=\"Select text in fields below and then click this button to add Italics\" href=\"#\" onclick=\"format_sel(\'i\');\" ><img alt=\"Select text in fields below and then click this button to add Italics\" border=\"0\" src=\"images/italic.gif\" width=\"21\" height=\"19\" align=\"middle\" class=\"style33\" /></a>

<input name=\"Title\" id=\"Title\" type=\"text\" placeholder=\"Add Title\" style=\"border: 1px solid #B5DB38; width: 250px\" onfocus=\"lastFocus=this; getelement_num(\'0\');\" onselect=\"storeCaret(this);\" onclick=\"storeCaret(this);\" onkeyup=\"storeCaret(this);\" /></td>

我应该注意，我也有将特殊字符插入表单的代码，这就是 storeCaret 代码的用途。这似乎工作正常。

非常感谢您的帮助。

标签： javascript

【解决方案1】：

这段代码似乎有两种类型的问题。

第一个是如果要获取选择的字符串值，应该使用toString()而不是toString。使用后者将为您提供对函数 toString 的引用，而不是返回值。我不知道您的警报功能在调用什么，但它似乎不正确。

第二个问题是您的 sel 变量当前是一个函数，即使您正确地执行了它（使用 toString()），您也会得到一个没有 .text 属性的字符串。你应该在那里打电话实际上是

var sel = window.getSelection();

这样您就可以获得对具有 .text 属性的 Html 元素的引用。

【讨论】：