如何使用javascript从textbox控件获取选定文本_Javascript_Html_Textarea_Textselection_Selectedtext

如何使用javascript从textbox控件获取选定文本

javascript html

如何使用javascript从textbox控件获取选定文本,javascript,html,textarea,textselection,selectedtext,Javascript,Html,Textarea,Textselection,Selectedtext,我有一个文本框和一个链接按钮。当我写一些文本，然后选择其中的一些，然后单击链接按钮，从文本框中选择的文本必须与messagebox一起显示我怎么做当我单击下面文本框的提交按钮时，消息框必须显示Lorem ipsum。因为在该区域选择了“Lorem ipsum” 如果我从页面中选择任何文本并单击“提交”按钮，它就会工作，但如果我将文本写入文本框并使其生效，它就不会工作。因为当我点击另一个空间时，文本框的选择被取消现在的问题是，当我从文本框中选择一个文本并单击任何其他控件或空格时，选中的

我有一个文本框和一个链接按钮。当我写一些文本，然后选择其中的一些，然后单击链接按钮，从文本框中选择的文本必须与messagebox一起显示

我怎么做

当我单击下面文本框的提交按钮时，消息框必须显示Lorem ipsum。因为在该区域选择了“Lorem ipsum”

如果我从页面中选择任何文本并单击“提交”按钮，它就会工作，但如果我将文本写入文本框并使其生效，它就不会工作。因为当我点击另一个空间时，文本框的选择被取消

现在的问题是，当我从文本框中选择一个文本并单击任何其他控件或空格时，选中的文本必须仍然处于选中状态

如何操作？

对于Opera、Firefox和Safari，您可以使用以下功能：

function getTextFieldSelection(textField) {
    return textField.value.substring(textField.selectionStart, textField.selectionEnd);
}

alert(getTextFieldSelection(document.getElementsByTagName("textarea")[0]));

然后，只需将对文本字段元素（如textarea或input元素）的引用传递给函数：

function getTextFieldSelection(textField) {
    return textField.value.substring(textField.selectionStart, textField.selectionEnd);
}

alert(getTextFieldSelection(document.getElementsByTagName("textarea")[0]));

或者，如果您希望和拥有自己的getSelection（）函数：

HTMLTextAreaElement.prototype.getSelection = HTMLInputElement.prototype.getSelection = function() {
    var ss = this.selectionStart;
    var se = this.selectionEnd;
    if (typeof ss === "number" && typeof se === "number") {
        return this.value.substring(this.selectionStart, this.selectionEnd);
    }
    return "";
};

然后，您只需执行以下操作：

alert(document.getElementsByTagName("textarea")[0].getSelection());
alert(document.getElementsByTagName("input")[0].getSelection());

例如。

对于Opera、Firefox和Safari，您可以使用以下功能：

function getTextFieldSelection(textField) {
    return textField.value.substring(textField.selectionStart, textField.selectionEnd);
}

alert(getTextFieldSelection(document.getElementsByTagName("textarea")[0]));

然后，只需将对文本字段元素（如textarea或input元素）的引用传递给函数：

function getTextFieldSelection(textField) {
    return textField.value.substring(textField.selectionStart, textField.selectionEnd);
}

alert(getTextFieldSelection(document.getElementsByTagName("textarea")[0]));

或者，如果您希望和拥有自己的getSelection（）函数：

HTMLTextAreaElement.prototype.getSelection = HTMLInputElement.prototype.getSelection = function() {
    var ss = this.selectionStart;
    var se = this.selectionEnd;
    if (typeof ss === "number" && typeof se === "number") {
        return this.value.substring(this.selectionStart, this.selectionEnd);
    }
    return "";
};

然后，您只需执行以下操作：

alert(document.getElementsByTagName("textarea")[0].getSelection());
alert(document.getElementsByTagName("input")[0].getSelection());

例如。

好的，下面是我的代码：

function ShowSelection()
{
  var textComponent = document.getElementById('Editor');
  var selectedText;

  if (textComponent.selectionStart !== undefined)
  {// Standards Compliant Version
    var startPos = textComponent.selectionStart;
    var endPos = textComponent.selectionEnd;
    selectedText = textComponent.value.substring(startPos, endPos);
  }
  else if (document.selection !== undefined)
  {// IE Version
    textComponent.focus();
    var sel = document.selection.createRange();
    selectedText = sel.text;
  }

  alert("You selected: " + selectedText);
}

问题是，虽然我为IE提供的代码在很多网站上都有，但在我当前的系统上，我无法让它在我的IE6副本上工作。也许它会对你有用，这就是我为什么给它的原因。
您寻找的技巧可能是.focus（）调用，将焦点返回给textarea，以便重新激活选择

[更新]我通过onKeyDown事件获得了正确的结果（选择内容）：

document.onkeydown = function (e) { ShowSelection(); }

所以代码是正确的。同样，问题是点击一个按钮来获得选择。。。我继续搜索

[更新]我没有成功地使用带有

li

标记的按钮，因为当我们单击它时，即取消选择以前的选择。上面的代码使用一个简单的

输入按钮，不过…
好的，下面是我的代码：
function ShowSelection()
{
  var textComponent = document.getElementById('Editor');
  var selectedText;

  if (textComponent.selectionStart !== undefined)
  {// Standards Compliant Version
    var startPos = textComponent.selectionStart;
    var endPos = textComponent.selectionEnd;
    selectedText = textComponent.value.substring(startPos, endPos);
  }
  else if (document.selection !== undefined)
  {// IE Version
    textComponent.focus();
    var sel = document.selection.createRange();
    selectedText = sel.text;
  }

  alert("You selected: " + selectedText);
}

问题是，虽然我为IE提供的代码在很多网站上都有，但在我当前的系统上，我无法让它在我的IE6副本上工作。也许它会对你有用，这就是我为什么给它的原因。

您寻找的技巧可能是.focus（）调用，将焦点返回给textarea，以便重新激活选择
[更新]我通过onKeyDown事件获得了正确的结果（选择内容）：
document.onkeydown = function (e) { ShowSelection(); }

所以代码是正确的。同样，问题是点击一个按钮来获得选择。。。我继续搜索
[更新]我没有成功地使用带有li
标记的按钮，因为当我们单击它时，即取消选择以前的选择。上面的代码使用一个简单的输入按钮，但是…
函数disp（）{
var text=document.getElementById（“text”）；
var t=text.value.substr（text.selectionStart、text.selectionEnd-text.selectionStart）；
警报（t）；
}
你好，你好吗？


函数disp（）{
var text=document.getElementById（“text”）；
var t=text.value.substr（text.selectionStart、text.selectionEnd-text.selectionStart）；
警报（t）；
}
你好，你好吗？

我的大粉丝
下面是一个非常小、独立的示例。下载jquery-textrange.js并复制到同一文件夹
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>jquery-textrange</title>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="jquery-textrange.js"></script>

<script>
/* run on document load **/
$(document).ready(function() {
    /* run on any change of 'textarea' **/
    $('#textareaId').bind('updateInfo keyup mousedown mousemove mouseup', function() {
        /* The magic is on this line **/
        var range = $(this).textrange();
        /* Stuff into selectedId.  I wanted to store this is a input field so it can be submitted in a form. **/
        $('#selectedId').val(range.text);
    });
});
</script>
</head>
<body>

    The smallest example possible using 
    <a href="https://github.com/dwieeb/jquery-textrange">
       jquery-textrange
    </a><br/>
    <textarea id="textareaId" >Some random content.</textarea><br/>
    <input type="text"  id="selectedId"  ></input>

</body>
</html>


jquery文本范围
/*在文档加载时运行**/
$（文档）.ready（函数（）{
/*运行“textarea”的任何更改**/
$（'#textraeaid'）.bind（'updateInfo keyup mousedown mousemove mouseup'，function（）{
/*魔术就在这条线上**/
var range=$（this.textrange（）；
/*我想把它存储为一个输入字段，这样就可以在表单中提交**/
$（'#selectedId'）.val（range.text）；
});
});
可能使用的最小示例


一些随机内容。

我的大粉丝
下面是一个非常小、独立的示例。下载jquery-textrange.js并复制到同一文件夹
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>jquery-textrange</title>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="jquery-textrange.js"></script>

<script>
/* run on document load **/
$(document).ready(function() {
    /* run on any change of 'textarea' **/
    $('#textareaId').bind('updateInfo keyup mousedown mousemove mouseup', function() {
        /* The magic is on this line **/
        var range = $(this).textrange();
        /* Stuff into selectedId.  I wanted to store this is a input field so it can be submitted in a form. **/
        $('#selectedId').val(range.text);
    });
});
</script>
</head>
<body>

    The smallest example possible using 
    <a href="https://github.com/dwieeb/jquery-textrange">
       jquery-textrange
    </a><br/>
    <textarea id="textareaId" >Some random content.</textarea><br/>
    <input type="text"  id="selectedId"  ></input>

</body>
</html>


jquery文本范围
/*在文档加载时运行**/
$（文档）.ready（函数（）{
/*运行“textarea”的任何更改**/
$（'#textraeaid'）.bind（'updateInfo keyup mousedown mousemove mouseup'，function（）{
/*魔术就在这条线上**/
var range=$（this.textrange（）；
/*我想把它存储为一个输入字段，这样就可以在表单中提交**/
$（'#selectedId'）.val（range.text）；
});
});
可能使用的最小示例


一些随机内容。

基于mouseup上发生文本选择的事实，这里有一个简单得多的解决方案，因此我们添加了一个事件侦听器：

document.querySelector（'textarea'）.addEventListener（'mouseup'，function（）{
window.mySelection=this.value.substring（this.selectionStart、this.selectionEnd）
//window.getSelection（）.toString（）；
});

选择一些文本
基于mouseup上发生文本选择的事实，这里有一个简单得多的解决方案，因此我们添加了一个事件侦听器：

document.querySelector（'textarea'）.addEventListener（'mouseup'，function（）{
window.mySelection=this.value.substring（this.selectionStart、this.selectionEnd）
//window.getSelection（）.toString（）；
});

选择一些文本
8年前的帖子，我知道。但无论如何。。。也许你可以尝试：在你的按钮上点击call$（''）.focus（），然后调用ShowSelection（），从活动元素中获取部分？这是可以做到的。8年前的帖子，我知道。但无论如何。。。也许您可以尝试：在按钮上单击call$（''）.focus（），然后调用ShowSelection（），从活动元素中获取零件？这是可以做到的。不需要任何jQu