使用 javascript 将文本插入 textarea 以用于 google chrome 扩展

Posted 2023-05-07

【中文标题】使用 javascript 将文本插入 textarea 以用于 google chrome 扩展

【英文标题】：Inserting text into textarea with javascript for google chrome extension

【发布时间】：2014-12-08 10:18:03

【问题描述】：

我正在尝试扩展现有 google chrome 扩展程序的功能。使用 Wrike google chrome 扩展，我的目标是添加一个按钮（或多个按钮），它将向描述字段（文本区域）添加一些文本。期望的效果是，如果用户单击“添加模板”按钮，代码/文本将被插入到 id="description" 的文本区域中，这是 Wrike chrome 扩展的本机。您将在下面找到一些我一直在使用的代码。

这是表格的描述部分。位于 createTask.html

<div class="main-description main-row">
    <textarea placeholder="Click to add description" id="description" class="main-description-text"></textarea>
</div>

这是我创建的按钮，它将开始将文本添加到文本区域：

<span class="btn m-green btn-addtemp" id="link">Add Template</span>

在 template.js 中（作为 createTask.html 中的外部 .js 文件正确链接：

function insertText(text) 
    document.getElementById("description").innerHTML = text;


document.addEventListener('DOMContentLoaded', function() 
    var link = document.getElementById('link');
    link.addEventListener('click', function() 
        insertText('Sample text here');
    );
);

我可以使用此代码将“此处的示例文本”插入带有 ID 的 div 中，但无法将其插入带有 id=description 的 textarea 中。任何帮助将不胜感激，如有必要，我非常乐意提供更详细的信息。谢谢！

【问题讨论】：

关于这个问题，有没有人有任何可能的解决方案可以将格式化文本添加到文本区域，或者对此有不同的解决方法？谢谢！

【参考方案1】：

用 element.value 试试：

function insertText(text) 
    document.getElementById("description").value= text;

【讨论】：

这非常有效。谢谢！我知道我错过了一件容易的事。

【参考方案2】：

要插入文本区域，请使用值属性：

function insertText(text) 
    document.getElementById("description").value= text;

而不是

function insertText(text) 
    document.getElementById("description").innerHTML = text;

【参考方案3】：

"这会将一些 HTML 表格和文本添加到描述字段（一个 textarea）。"，这是不可能的，textareas 不能包含 html。