相关疑难解决方法(0)

我正在尝试制作自己的WYSIWYG编辑器.有什么办法,如何获取用户在textarea中选择的文本？

例如,如果用户选择了某个单词然后单击按钮,我该如何找出选择了哪个文本？

我正在使用jQuery.

我是一名JS程序员,我一直在尝试使用jQuery,但遇到了一些令人费解的问题.

我觉得人们使用jQuery远远超过必要.我真的只是想知道为什么选择jQuery可能比使用纯JS更好.

我知道webfx就像动画和淡化一样有意义但是对于像添加事件监听器这样的东西它似乎同样容易使用

obj = document.getElementByID(_ID_);
obj.addEventListener("mousedown"...);

这方面的一个例子是我今天早些时候在StackOverflow上找到的关于为突出显示的文本执行操作的答案.获取突出显示/选定的文本

在http://mark.koli.ch/2009/09/use-javascript-and-jquery-to-get-user-selected-text.html的答案中链接的示例中

该人使用绑定功能到文档.为什么使用bind而不是addEventListener.另外,对于jQuery,一切都需要包含在.ready()方法中,这比(或者为什么选择它)更好

document.addEventListener('load', function () { ... }, false);

还有一次我看到jQuery使用这让我很困惑,我希望你们能为我发光一些.

我使用鼠标在html页面(在firefox中打开)选择一些文本,并使用javascript函数,我创建/获取与所选文本对应的rangeobject.

 userSelection =window.getSelection(); 
 var rangeObject = getRangeObject(userSelection);

现在我想突出显示rangeobject下的所有文本.我这样做,

  var span = document.createElement("span");
  rangeObject.surroundContents(span);
  span.style.backgroundColor = "yellow";

好吧,这个工作正常,只有当rangeobject(起始点和端点)位于同一个textnode中时,它才会突出显示相应的text.Ex

    <p>In this case,the text selected will be highlighted properly,
       because the selected text lies under a single textnode</p>

但是如果rangeobject覆盖了多个textnode,那么它就不能正常工作,它只突出显示位于第一个textnode中的文本,Ex

 <p><h3>In this case</h3>, only the text inside the header(h3) 
  will be highlighted, not any text outside the header</p> 

任何想法我怎么做,所有在rangeobject下的文本,突出显示,独立于范围是在单个节点还是多个节点？谢谢....

我想使用该getSelection函数从文章中选择单词到视图框.

这是我的代码:http://jsfiddle.net/xQKNh/2/.

现在我想问一下,如何使用JavaScript来选择整个单词？

为了解释,

Is your question about programming?

在我的代码中,如果我选择r question about pro,view box将显示

r question about pro

但是如何完成这些单词呢？所以输出:

your question about programming. 

Javascript代码:

function getSelected() {
  if(window.getSelection) { return window.getSelection(); }
  else if(document.getSelection) { return document.getSelection(); }
  else {
    var selection = document.selection && document.selection.createRange();
    if(selection.text) { return selection.text; }
    return false;
  }
  return false;
}
$(document).ready(function() {
  $('#content-area').mouseup(function() {
    var selection = getSelected();
    if(selection && (selection = new …

我有一个令人满意的div

<div class="editable" contenteditable="true"></div>

用户可以在那里输入任何内容.当用户在div中进行选择时,有没有办法获取事件.

就像是:

$('.editable').onSelection(function(e, selection){alert(selection);}

我正在构建一个WYSIWYG富文本编辑器.

当用户选择他/她的文本的一部分时,我想在工具提示中呈现菜单.呈现菜单工作正常但我想只显示用户将鼠标悬停在所选文本上.

如图解:

我还没有决定定位(我喜欢它的说明方式),但澄清一下,这不是问题的重点.

问题是:如何过滤选定文本上发生的悬停事件？

问题:

1. 我不能只是监听文本选择事件或测试悬停事件,以查看它们是否超出了在其中选择了文本的元素.左图像会产生误报.

2. 我知道如何获取所选文本,但我不知道如何获取所选区域.

在我看来,理想的解决方案是以某种方式计算所选文本的区域并测试鼠标悬停事件是否发生在该区域.

如果我从文本区域中选择一个文本我需要知道选择了哪个文本,例如"hello world"如果我选择你好我想看看你好如何选择如何在jquery中执行此操作.我想让它变得大胆.

<textarea id="editor" cols="80" rows="20">
   Hello world, This is Me!
</textarea> 
<button onclick="SelectText()">
  Bold
</button>

几乎只是问题.我有一个客户要求负面设计在整个网页上都有近乎白色的文字,但测试人员说,从网站上复制和粘贴是很烦人的,因为在复制到Word等时一切都显示为白色文本.

当用户尝试从网站复制文本时,有没有办法抢先删除格式？或者有没有办法劫持实际放在剪贴板上的内容？

我有一个 contenteditable div 并希望在用户单击span.

我的问题是，当我单击 时span，选择未选中，因此window.getSelection().toString()返回''。

我怎样才能在点击a 时span让它工作？

我知道实际的getSelection()作品，因为如果我window.getSelection().toString()在setTimeout5 秒内换行，5 秒后，我会得到选定的文本！

我的代码：

$('#btn').click(function() {
  console.log(window.getSelection().toString()); //returns ''
});

#btn {
  cursor: pointer;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span id='btn'>get selection</span>
<br><br>
<div id='ce' contenteditable='true'>test</div>

我有以下代码:

<div contenteditable="true" id="editor">
    <p>This is example text with <span class="spoiler">spoiler<strong>s</strong></span></p>
  <p>The <span class="spoiler">spoiler</span> exists in multiple paragraphs</p>
</div>
<button onclick="removeSpoiler();">remove spoiler</button>

用户可以选择文本,然后单击按钮以删除<span class="spoiler">格式.单击按钮后,仍必须选中文本.

例如:用户选择"with spoilers.sp".他点击了"删除剧透".所需的输出是:

<div contenteditable="true" id="editor">
    <p>This is example text with spoiler<strong>s</strong></p>
  <p>The sp<span class="spoiler">oiler</span> exists in multiple paragraphs</p>
</div>
<button onclick="removeSpoiler();">remove spoiler</button>

我尝试的一个小问题(我真的不知道从那里去哪里):http://jsfiddle.net/632cr/