相关疑难解决方法(0)

是否有使用JavaScript取消选择所有文本的功能?

javascript中是否有一个函数可以取消选择所有选定的文本?我认为它必须是一个简单的全局函数document.body.deselectAll();或类似的东西.

javascript selection

84
推荐指数
4
解决办法
6万
查看次数

获取范围的开始和结束偏移量相对于其父容器

假设我有这个HTML元素:

<div id="parent">
 Hello everyone! <a>This is my home page</a>
 <p>Bye!</p>
</div>
Run Code Online (Sandbox Code Playgroud)

用户用鼠标选择"家".

我希望能够确定#parent他的选择中有多少个字符开始(以及#parent他选择结束时有多少个字符结束).即使他选择了HTML标记,这也应该有效.(我需要它在所有浏览器中工作)

range.startOffset 看起来很有希望,但它只是相对于范围的直接容器的偏移量,并且仅当容器是文本节点时才是字符偏移量.

javascript textrange

66
推荐指数
3
解决办法
6万
查看次数

javascript用户选择突出显示

我正在尝试使用javascript来突出显示用户在单击某个奇数突出显示按钮时选择的文本(如<span style ="background-color:yellow">突出显示的文本</ span>).它只需要与WebKit或Firefox一起使用,但它似乎几乎不可能,因为它必须在以下情况下工作:

<p>this is text</p>
<p>I eat food</p>
Run Code Online (Sandbox Code Playgroud)

当用户在浏览器中选择"is text"到"I eat"时(不能只是在那里放一个跨度).

这种情况:

<span><span>this is text</span>middle text<span>this is text</span></span>
Run Code Online (Sandbox Code Playgroud)

当用户在浏览器中选择"is text"到"this is"时(即使你可以在选择中的每个元素周围包含你的高亮显示,我希望你看到你试图让中间文本突出显示).

这个问题似乎没有在任何地方得到解决,坦率地说我怀疑这是可能的.

如果你可以从选择中得到的Range作为一个完整的html字符串,可以解析然后替换,这是可能的,但据我所知,你不能得到一个范围的原始html ..可怜.

javascript highlight

18
推荐指数
5
解决办法
3万
查看次数

javascript:带有html标签的focusOffset

我有一个contenteditable div如下(| =光标位置):

<div id="mydiv" contenteditable="true">lorem ipsum <spanclass="highlight">indol|or sit</span> amet consectetur <span class='tag'>adipiscing</span> elit</div>
Run Code Online (Sandbox Code Playgroud)

我想得到当前的光标位置,包括html标签.我的代码:

var offset = document.getSelection().focusOffset;
Run Code Online (Sandbox Code Playgroud)

偏移量返回5(最后一个标签的全文)但我需要它来处理html标签.预期的返回值是40.代码必须与所有最近的浏览器一起使用.(我也检查了这个:带有HTML标签的window.getSelection()偏移量?但它没有回答我的问题).有任何想法吗 ?

html javascript php jquery

11
推荐指数
2
解决办法
551
查看次数

在特定点插入字符但保留标签?

更新#2

好的,接下来会有更多的测试.当我使用虚假间隔时,看起来代码工作正常,但正则表达式最终失败.具体而言,以下方案有效:

  1. 选择a标签上方或下方的单词
  2. 您只能在a标签的正上方或下方选择一条线
  3. 您可以在a标签上方/下方选择多条线
  4. 您可以在任何a标记下方选择多行

以下方案不起作用:

  1. 您选择行/多线上面a的标签,然后将线/多线下方a标签

当它"不起作用"时会发生什么,它会a从DOM中删除标签间隔符.这可能是正则表达式的问题......

基本上,当您选择a标记周围的文本时,它会失败.


更新:

我并不需要包装每行中一个p标签,我可以改用一个内联元件,例如a,span,或label标签,带有display:inline-block和高度+宽度作为一个新行元件(<br />).这应该可以更容易地修改代码,因为唯一需要更改的部分是我在文本之间获取文本.我只需要更改那部分,selectedText.textContent检索也在边界内的HTML而不仅仅是文本.


我正在创建一个要求用户选择文本的Phonegap.但是,我需要对文本选择进行精细控制,并且不能再将整个文本内容放在pre样式p标记中.相反,我需要用类似的东西来表示一个换行符<a class="space"></a>,以便可以精确地突出显示正确的单词.当我的文字看起来像这样:

<p class="text">This is line one

Line two

Line three
</p>
Run Code Online (Sandbox Code Playgroud)

并且.text{ white-space:pre-wrap },以下代码允许我选择单词,然后用span元素包装文本以显示文本突出显示:

$("p").on("copy", highlight);

function highlight() {
    var text = window.getSelection().toString();
    var selection …
Run Code Online (Sandbox Code Playgroud)

javascript jquery

7
推荐指数
1
解决办法
738
查看次数

Javascript突出显示所选范围按钮

我正在尝试为页面创建一个学习工具,允许用户选择页面上的任何文本并单击按钮.然后,此单击将使用黄色背景格式化所选文本.我可以在单个标签内部进行此工作,但如果选择范围跨越多个标签(例如,无序列表中的第一个LI以及第二个的一半),我将难以应用该样式.不幸的是,我不能在这里用一个跨度包装选择.

基本上,我想关联的影响contentEditable,并execCommand没有除了背景颜色应用到选定的文本与按钮的点击实际进行任何编辑的网页上.

我对jQuery解决方案持开放态度,并发现这个插件似乎简化了跨浏览器创建范围的能力,但我无法使用它来将任何格式应用于所选范围.我可以从控制台看到它正在接受选择,但使用类似的东西:

var selected = $().selectedText();
$(selected).css("background-color","yellow");
Run Code Online (Sandbox Code Playgroud)

没有效果.

任何指导我正确方向的帮助将不胜感激.

javascript jquery range

4
推荐指数
1
解决办法
4267
查看次数

标签 统计

javascript ×6

jquery ×3

highlight ×1

html ×1

php ×1

range ×1

selection ×1

textrange ×1