如何在textarea中获取所选文本？
在HTML中，要获取<textarea>标签中所选文本，可以使用JavaScript的selectionStart和selectionEnd属性。以下是一个简单的示例：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>获取所选文本</title>
</head>
<body>
<textarea id="myTextarea" rows="4" cols="50">
请输入一些文本，然后选择一部分文本。
</textarea>
<button onclick="getSelectedText()">获取所选文本</button>
<p id="result"></p>
<script>
function getSelectedText() {
const textarea = document.getElementById('myTextarea');
const startIndex = textarea.selectionStart;
const endIndex = textarea.selectionEnd;
const selectedText = textarea.value.substring(startIndex, endIndex);
document.getElementById('result').innerHTML = `所选文本：${selectedText}`;
}
</script>
</body>
</html>在这个示例中，我们首先创建了一个<textarea>元素，用户可以在其中输入文本并选择一部分文本。然后，我们创建了一个按钮，当用户点击该按钮时，将调用getSelectedText()函数。该函数使用selectionStart和selectionEnd属性获取所选文本的起始和结束索引，然后使用substring()方法从文本中提取所选文本。最后，我们将所选文本显示在<p>元素中。
相关·内容
认为这是一个简单的问题，但我对web非常陌生，所以我道歉:) -> on onSelect事件，如何获取所选内容的内容？是否有办法修改选定的文本，例如高亮显示？
到目前为止，这就是我所拥有的：
<textarea id="text">
Text to be highlighted
</textarea>
在js中：
let text_selection = document.getElementById("text");
text_selection.addEventListener("select", high
浏览 5提问于2020-10-04得票数 5
回答已采纳
我正在做一个程序，我做了一个文本区
document.write('<textarea id="text1" rows="10" cols="50"></textarea>')
我需要将用户输入保存到一个变量中，但无论我做什么，它都不会起作用。而不是用户文本，只是说HTML Text Area
我做什么好？
浏览 3提问于2014-01-17得票数 0
我正在尝试使用Rxjs和javascript创建基本的文本编辑器。我已经在.html文件中创建了一个名为'B‘的按钮，当点击该按钮时，我是否可以使用下面的bold.How ()函数中的javascript对文本区中的所选文本设置样式？另外，如果选中的文本完全是粗体，那么如何使粗体按钮自动选中？
我知道这是一个非常基本的疑问，但我是javascript的初学者。如果有人能帮助我理解这一点，那就太好了。
let btnbold=document.getElementById('btnbold');
let textarea=document.getElementById(&
浏览 0提问于2021-03-17得票数 0
我正在尝试使用Javascript替换Chrome中任意选定TEXTAREA节点中的选定文本(！不是内容可编辑的div !)我在很多地方看到的用来替换所选文本的代码片段基本上是这样做的：
var sel = window.getSelection();
var range = sel.getRangeAt(0);
range.insertNode( document.createTextNode("test "));
但是，这不适用于TEXTAREA或input TYPE=TEXT等输入字段。文本将插入TEXTAREA之前，而不是TEXTAREA内部。
还有一种替代方法可以使用
浏览 1提问于2012-08-16得票数 5
回答已采纳
1回答
我想做一个文本编辑器。它应该按照所有文本编辑器的工作方式工作(包括我现在正在使用的这个编辑器)，这样用户就可以选择文本，按下按钮或其他什么，然后执行一些功能。我希望我的编辑器能够以以下方式工作: 1.用户选择2.函数selected()被触发，使所选文本具有一定的广度。3.当用户单击"B“或"I”等按钮时，会调用更改span元素的.style的函数。目前，我已经知道如何从用户选择中获得字符串，仅此而已。
<body>
<textarea onselect="selected()">Some text here, m
浏览 0提问于2017-07-06得票数 1
回答已采纳
1回答
例如，我想创建一个简单的编辑器来使选定的文本更加粗体。
有一个带有"Super text“值的文本区域。
现在我选择这个文本的一部分(例如"Super")。如何获取所选值？
<textarea (selected)=".."></textarea>
这将在每次我在textarea中选择某个内容时调用一个函数。
<textarea (selected)="view(textarea.value)" #textarea></textarea>
当我选择某项内容时，这将打印出一个完整的文本区域值。
浏览 16提问于2016-07-26得票数 1
3回答
我有一个textArea和一个列表。当用户双击列表项时，所选项的标签应插入到文本区域中。当在textArea中选择一个文本时，应该替换它，否则只需要将该文本插入到现有文本中的插入符号位置。
我已经设法获得了文本和所有内容，但我就是不能把它插入到插入符号处。有人知道怎么做吗？
浏览 0提问于2009-09-10得票数 1
回答已采纳
2回答
This is my code.The文本区域不显示该值。它只显示空的文本区域。数据库表中有值。
<form:textarea path="groupDescription" placeholder="Description:"
value="${roleGroupObject.groupDescription}" />
浏览 1提问于2014-07-30得票数 0
我正在开发一个ReactJS应用程序，并试图在下拉列表(语义UI组件)中获取所选选项的文本；
exposedCampaignOnChange = (e, {value}) => {
this.props.campaignExposedSelected(value);
};
<Dropdown
placeholder='Campaign Exposed To'
fluid
search
selection
multiple
options={this.state.campaigns}
onChange=
浏览 0提问于2018-05-24得票数 3
回答已采纳
1回答
使用Firefox和其他现代浏览器，我们可以选择页面的一些文本，然后选择Drag and Drop。
这个拖放的目标，可以是任何HTML输入，甚至是条形地址，搜索字段等等。
我想知道这种drag event是由浏览器以一种特殊的方式处理的，还是可以捕获它(一个DOM事件或类似的东西)。
更确切地说，我试图将这个删除功能添加到一些GWT对象中，然后能够检索所选的文本。
我用的是GWT。
编辑，工作解决方案
这是一些相关的代码：
TextArea text = new TextArea();
SimplePanel panel = new SimplePanel(text);
TextArea
浏览 4提问于2012-06-06得票数 0
回答已采纳
1回答
在textarea中选择文本时，所选内容的可见覆盖将包含在textarea中，如下所示：
当你选择“常规”元素上的文本时，比如一个简单的div，你会得到如下结果：
可见的选择会使元素溢出。是否有CSS属性或任何其他方法来保持HTML元素中所选内容的可视？
浏览 2提问于2015-06-21得票数 4
当某人选择文本并按下粗体按钮时，所选文本将为粗体，而不是所有文本区域字符。
document.getElementById("bold").onclick = function() {
document.getElementById("textarea").style.fontWeight = "800";
}
<textarea id="textarea"></textarea>
<button id="bold">Make bold</button>
浏览 3提问于2022-01-23得票数 0
在appendChild()和Range.selectNode()在JavaScript中的结合中，我面临一个问题。
当尝试使用一个范围来选择新附加的<textarea>节点时，它会选择太多的DOM。复制和粘贴所选内容似乎只包含一个空格。
但是，如果我从一开始就将<textarea>节点放入DOM中(即不要将它添加到appendChild()中)，那么它运行得非常好，并且我可以按照预期复制和粘贴所选的文本。
请注意，CSS在这里并不是必要的，但它强调了一个事实，即所选内容不仅仅包含<textarea> (至少在Chrome中是这样的)。
HTML：
<
浏览 4提问于2014-09-11得票数 3
回答已采纳
我想在下面所选的editText上显示对话框。我有一个编辑文本的列表。当我单击其中一个编辑文本时，对话框将显示在此编辑文本的下方。我想在照片里试试。这在android中是可能的吗？
谢谢。
浏览 0提问于2013-05-02得票数 1
回答已采纳
2回答
是否可以使用纯JS将选定的文本粘贴到指定的文本区域中？在我的例子中，我想选择其中一个文本区域中的文本，当按下ctrl &A时，所选文本将粘贴到最后一个(V1)文本区域中。
我发现了类似的情况()，但它只适用于1个输入文本区域，但我有大量的文本区域。
function Addkey(e) {
if (e.ctrlKey && e.keyCode == 65) {
e.preventDefault();
document.execCommand("co
浏览 21提问于2021-03-14得票数 0
1回答
我正在使用真正简单的wysiwyg编辑器为我的网站。
我在徘徊，我如何才能准确地得到当前数量的字符在它的文本区域，然后输出到它下面？
我，但似乎没有很多人使用它，答案对我来说没有多大意义，有人能帮我澄清一下吗？
该人的答复如下：
var numOfCharacters = $textArea.data("sceditor").val().length；
其中："$textArea“是一个变量，它引用了封装在jQuery对象中的textarea DOM元素。
我不知道那是什么意思，但我相信你们中的一些人会的。
我想将长度输出到文本区域下面的一些文本。
浏览 5提问于2013-05-24得票数 0
2回答
缩进所选文本4个空格
、、、
我希望使用jQuery将<textarea>中的选定文本缩进4个空格，就像StackOverflow对代码所做的那样。我这样做是为了创建一个类似于SO的文本编辑器，但只具有基本的功能。
我不想要现成编辑器的链接或建议；除了上面的问题，我已经得到了我想要的一切。有人能给我一些关于如何缩进所选文本或一些代码片段的建议吗？
谢谢。
浏览 0提问于2011-07-16得票数 5
回答已采纳
提取所选QComboBox项的文本是众所周知的，但是如何为任意索引项(不一定是所选的索引项)在QComboBox中获取文本？
浏览 3提问于2014-11-18得票数 3
回答已采纳
3回答
我有两个<textarea>，一个是id="input"，另一个是id="selection"。
<textarea id="input">将包含一些超文本标记语言。用户将在该文本区域中选择一些文本，单击一个按钮，所选文本将被复制到<textarea id="selection">。
我可以使用jQuery或普通的JavaScript，我希望它能在IE7+，Safari和火狐中工作。
浏览 9提问于2010-12-03得票数 4
回答已采纳
我试图在多个select中获得所选选项，我可以以数组的形式获得值，但无法获得该选项的文本。
$(function() {
$('#sizeAddCategory').change(function(e) {
var selected = $(e.target).text();
console.log("selected " + selected);
$('#textAreaAddCategory').val(selected.join(','));
});
});
<script src=
浏览 3提问于2020-08-27得票数 0
回答已采纳
基本上，我想要的是，如果用户选择文本区域中的一些文本并按ctrl +b，那么所选内容中的文本应该被星号包围。
基本上我想要的是：
1)文本区域内容：“你好，这是一些文本”
2)用户选择一些文本并按ctrl +b键"hello this is text“(假定粗体部分是文本选择)
3)所以我希望textarea内容是：“你好，这*是一些*文本”
4)如果用户按ctrl +z(或任何撤销操作)，textarea内容应该返回为"hello，这是一些文本“。
我尝试过和以及类似的方法，但问题是在大多数浏览器上执行撤销(ctrl + z)时，我希望文本返回到步骤1中的值，但这种
浏览 1提问于2016-05-27得票数 7
回答已采纳
我已经为我的应用程序创建了一个自定义的@ textarea系统，我唯一的问题是开始输入textarea，然后我会选择我想提到的用户，而所选用户的名称只是添加到textarea的末尾，所以如果我只输入了@，但是如果我输入了@ja，然后选择了jason smith，它现在会说@jaJason Smith如何删除在该之后键入的任何文本，然后添加到我的字符串中。这是在textarea中完成的
所以我现在的功能是这样的。
addMention(user: any): void {
const textarea = document.querySelector('textarea');
浏览 1提问于2018-07-18得票数 0
回答已采纳
我正在尝试读入文本区域中选定文本的值。下面是我的代码：
function readSelected(id)
{
textarea = document.getElementById(id);
if (document.selection)
{ //Code for IE
textarea.focus();
sel = document.selection.createRange();
alert(sel.text);
}
else
{ // Code for Mozilla Firefox
浏览 2提问于2010-08-25得票数 1
我试图重复或复制这个文本区域：
<textarea name="Content" type="text"
id="Content" value="Content"
onfocus="if(this.value==this.defaultValue)this.value='';"
onblur="if(this.value=='')this.value=this.defaultValue;">
</textarea>
浏览 2提问于2013-10-10得票数 1
回答已采纳
这是我正在努力解决的问题。我有这个文本区，它可以显示带有HTML标签的文本。我使用的是Angular 10和angular-material/@latest。 下面是显示HTML文档的文本区域。 <mat-form-field *ngIf="editStatement">
<textarea matInput [innerHTML]="statement.statement_description_html"></textarea>
</mat-form-fiel
浏览 79提问于2021-03-25得票数 0
回答已采纳
2回答
在我的Ionic应用程序中，我有一个Textarea，用户可以在其中选择一个文本，并通过按钮粗体，在所选内容周围添加b。
如何应用粗体格式，替换输出文本上的b？
这是我的密码。这是
<textarea id="TheTextInput" rows="5"></textarea>
<input type="button" id="TheButton" value="click" />
<input type="button" id="bold"
浏览 2提问于2016-10-24得票数 0
回答已采纳
在我当前的spring项目中，我正在寻找一种映射字段的方法，就像在我的一个实体中一样：
私有映射属性；
其中，键的类型应该是表示语言的双字符字符串，值的类型应该是长度约为128KB的字符串。
这样，我就可以在数据库中使用如下内容来存储此属性的数据：
<select name="..." multiple="multiple">
<option value="..."> ... </option>
</select>
<textarea name="..."> .
浏览 4提问于2015-02-11得票数 1
我有一个变量列表和一个字段列表，其中可能包含文本输入或文本区域。我想点击一个变量名，并让它自动地附加到最后一个有焦点的输入/textarea字段中的内容末尾(假设最后一个焦点是这些字段中的一个)。
下面是一个JsFiddle，它说明了我要做的事情：
HTML：
Field 1: <input type="text" name="field[1]" /><br/>
Field 2: <input type="text" name="field[2]" /><br/>
Field 3:
浏览 5提问于2014-05-29得票数 1
回答已采纳
我有一些代码，通过jsoup解析网页上的输入字段。完成代码后，我发现我的表单还有一些文本区字段和下拉列表
<textarea name='asr_remarks'class='inputbox-highlighted-false'cols=70 rows=3
onKeyPress="LimitRemark(this);" >This is a test remark for info only</textarea>
除了我的选择框之外，我如何检索所选的名称和值？
<select name="supp"
浏览 6提问于2014-12-04得票数 0
我在Django应用程序中创建了一个联系人表单。
在我的模板中有一个textarea字段：
<textarea class="form-control" rows="8" id="email_body" name="email_body" placeholder="Email body"></textarea>
在我的views.py中，这个文本区域的内容被传递给一个发送电子邮件的函数：
def index(request):
# some code here
email_b
浏览 10提问于2016-11-14得票数 0
回答已采纳
1回答
我创建了一个JFrame，其中包含两个JPanels(panel1,panel2).i，在panel1中添加了panel2。增加(Panel2)；
我在panel2中添加了一个文本区域。
panel2.add(textarea);
最后panel1到getContentPane
getContentPane().add(panel1);
现在，我将通过以下方法获得文本区域的位置
textarea.getLocation()；
我已经创建了一个保存文本区域(x，y)值的Save按钮，我正在使用xml存储(x，y)值。
现在，当我关闭并重新打开jar文件时，textarea位置没有更改，但是xml
浏览 4提问于2013-05-22得票数 0
当我按下Ctrl +A(命令+ A)时，它会选择页面中的所有文本。当我按下Ctrl +A(命令+ A)时，如何只选择所选div中的字母？
下面是我的完整代码。
import React, { useState } from 'react';
const Test = () => {
const [chatList, setChatList] = useState([]);
const onSubmit = (e) => {
e.preventDefault();
const value = e.target[0].value;
se
浏览 1提问于2022-07-10得票数 0
回答已采纳
使用普通textarea的工作示例 如果您有以下代码代码： <textarea dir="auto"></textarea> 然后你开始写，比如阿拉伯语，你会发现文本会自动右对齐，就像它应该的那样。 角度材质的textarea的非工作示例 <mat-form-field appearance="outline">
<mat-label>Post</mat-label>
<textarea dir="auto" matInput></textarea>
&
浏览 18提问于2019-09-20得票数 1
我正在尝试用zend制作一个表单，我确实知道如何从表单中进行选择
public function init()
{
$this->addElement("text","titulo",array(
"label" => "Titulo"
));
$this->setAttrib("id", "enviarNoticia");
$this->setAttrib(
浏览 1提问于2012-02-02得票数 0
我正在构建一个聊天系统，允许用户添加表情符号。
就像上面的jsfiddler示例一样，我将文本区域中的当前文本与所选的表情符号组合，然后将此文本添加回文本区域。
$(function() {
var data = $('textarea').val();
var emoticon = ':)';
$('textarea').val(data + emoticon);
$('textarea').focus();
});
问题是，当我将焦点重新设置到文本区域时，光标位于文本的开头。
如何将光标设
浏览 1提问于2012-11-17得票数 17
回答已采纳
1回答
大写文本区域中的文本选择
、、、
当我尝试运行以下代码时，会得到一个undefined is not a function错误：
$(document).ready(function() {
$("#textarea").select(function() {
var selection = window.getSelection();
$("#upper").click(function() {
// alert(selection);
var upper = selection.toUpperCase()
浏览 0提问于2015-03-30得票数 0
回答已采纳
1回答
我尝试将字符串数组的内容显示到文本区域中。
基本上，我有一个select，用户可以在该select上选择他的输出，当他选择时，数组将填充所选的字符串。
这是我的HTML：
<select class="form-control" id="dispatchOutput" ng-model="dispatchOutput"
ng-options="item as (item.output | uppercase) for item in searchFilterDispatcher.params"
ng-chang
浏览 23提问于2017-07-17得票数 1
我想在TextArea中集成项目渲染器。其目的是通过自己的简单界面可视化关键字，同时用户仍然可以将整个内容视为普通文本，以选择字体、字体大小等。
例如，这可以是TextArea的htmltext：
<TEXTFORMAT LEADING="2">
<P ALIGN="RIGHT">
<FONT FACE="Century Gothic" SIZE="24" COLOR="#999999">
The temperature is {TEMP|DE
浏览 3提问于2011-06-21得票数 1
回答已采纳
如何获取文本区域值中的段落内容文本
<p ng-model="extrap" >Some parragraph content</p>
<textarea ng-model="oneps"></textarea>
<script>
(function() {
angular
.module("TextAngularDemo", ['textAngular'])
.controller("DemoController"
浏览 2提问于2019-10-21得票数 0
我需要给我的文本区域字段在bootstrap中的背景颜色这是文本区域字段 <div class="form-group">
<div class="col-xs-12">
<textarea class="form-control" id="exampleTextarea" rows="6" placeholder="Message"></textarea>
</div>
</div>
浏览 41提问于2017-07-22得票数 6
回答已采纳
我想让一个程序和记事本一样，选项卡选项。我用JTabbedPane创建了一个选项卡，并在其中添加了TextArea。选项卡在程序运行时创建了whit用户。如何通过用户访问所选选项卡中的JTextArea来保存数据和其他选项？
浏览 2提问于2015-06-06得票数 0
回答已采纳
我希望将事件处理程序附加到处理当前选择的<span>节点，但在触发单击事件之前，浏览器似乎已清除选择(Chrome16.0.912.63)。
我可以通过在onmousedown上附加一个处理程序来解决这个问题，但我不希望这样做。
下面是一个简短的HTML示例，它说明了这个问题(需要jQuery)：
<span class="paste">PASTE</span>
<textarea id="selected"></textarea>
<script type="text/javascri
浏览 1提问于2012-01-04得票数 1
2回答
我有一个，它包含一个定制的可编辑的JSON文件，您可以在这里实时看到编辑的结果。我还可以循环“point”属性中的条目，它是一个列表，它在画布中显示结果，在画布中可以看到JSON结果，这样就可以看到所选择的点。
我希望文本区域中的点能够在选定时进行格式化，例如textarea JSON中的选定点被突出显示为黄色，或者将文本颜色更改为蓝色或类似的内容。
我试过这样做：
<textarea id="objtext">
not orange
<span style="color:orange">
orange
<
浏览 13提问于2021-10-05得票数 0
回答已采纳
1回答
我试图通过通过VS2012开发的加载项获取SSMS中活动窗口的文本。我可以看到属性包含关于所选文本的一些信息，但我也希望能够访问全文。
有人知道这怎么可能吗？
是否有人知道如何设置活动窗口的文本，包括所选文本和全文？
谢谢
浏览 3提问于2014-08-08得票数 1
回答已采纳
如何将文本输入转换为ASCII并在文本区域显示。
HTML
<div class="form-group">
<label for="exampleInputPassword1">Favorite Food</label>
<input type="text" class="form-control" id="fFood" placeholder="Favorite Food" required>
<textarea na
浏览 5提问于2014-04-22得票数 0
回答已采纳
3回答
我试图让文本区域在文本值发生变化时自动调整其高度：
<textarea ref="textarea" v-model="message"> </textarea>
我使用一个观察者来监视与文本区域相关联的组件变量"message“。每当消息更改时，将触发一个函数来调整textarea高度：
watch: {
message: function(){
this.$refs.textarea.style.height="auto";
this.$refs.textarea.style.height
浏览 12提问于2022-01-22得票数 0
回答已采纳
我使用javascript和jQuery来设计一个注释框。
我的页面有一个textarea和3个按钮(粗体、下划线和斜体)。如果用户在textarea中键入文本，选择并单击任意按钮，则所选文本应变为粗体、下划线或斜体(下面有此功能)。
我的问题是，在单击带有选定文本的按钮后，尽管html标记已正确插入，但所选内容将丢失。也就是说，当我输入：“你好，我在这里。”，选择“我在这里”并单击粗体按钮。，我在这里，变得大胆，但是如果我也想划下划线或斜体，我必须重新选择文本。
因此，我的问题是:如何在textarea中重新选择选定的文本？
我尝试了myTextarea.select()，但是这段代码将选择
浏览 1提问于2015-05-07得票数 1
回答已采纳
1回答
我正在开发一个chrome扩展，并试图在插件内的textarea中的选项卡上输出选定的文本。
获取所选文本的函数工作得很好，但我不能将值设置为插件中的textarea元素。
问题：，我如何正确地存储这个值，然后通过数据绑定将其传递给文本区域？
HTML:
<div>
<p>Here will appear the selected text :</p>
<textarea name="selectedText" id="selectedText" [(ngModel)]="selectedText
浏览 1提问于2018-04-25得票数 0
回答已采纳
3回答
我正在使用文本编辑器，它将显示在添加表单中。我通过ajax.When加载表单，单击添加按钮，添加表单将加载到ajax.Now中。问题是我的HTML文本编辑器脚本文件无法加载到我的ajax form.Simple文本区域中。如何在ajax表单中加载文本编辑器，请告诉我。
这就是我正在使用的编辑器
<script type='text/javascript'>
var j = jQuery.noConflict();
j(function() {
j("#Textarea1").htmlarea(
浏览 0提问于2011-09-26得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
腾讯会议活动推荐
腾讯云开发者
