使用 Javascript 选定单词的索引

2023-12-07

如何使用 Javascript 获取 HTML 中选定文本的索引? 例如,在一个 HTML 文件中,有如下段落:

我住在印度。印度是一个非常美丽的国家。

现在如果用户选择India在第一句话中应该有一个alert 5如果用户选择India第二行然后有一个alert 6.

如何获取用户选择的单词的索引?


你可以用新的来做到这一点文本范围模块 of my 兰吉图书馆。 Rangy 的 Range 对象有moveStart() and moveEnd()方法允许您一次向任一方向扩展一个单词的范围。

这是一个演示:http://jsfiddle.net/timdown/ArMHy/

Code:

var sel = rangy.getSelection();
if (sel.rangeCount > 0) {
    var range = sel.getRangeAt(0);

    // Expand the range to contain the whole word
    range.expand("word");

    // Count all the preceding words in the document
    var precedingWordCount = 0;
    while (range.moveStart("word", -1)) {
        precedingWordCount++;
    }

    // Display results
    alert("Selection starts in word number " + (precedingWordCount + 1));        
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 Javascript 选定单词的索引 的相关文章

  • 如何在react-bootstrap中禁用表单提交的

    在下面的代码片段中 我有许多文本类型的输入表单 如果用户点击 我似乎会得到相同的合成事件 就像他们按下提交按钮一样 我想忽略作为表单提交 只允许一个人按下 提交 按钮 我删除了一些表单组以减少示例 在所有情况下 按钮或 ENTER 键 e
  • Chrome 中的性能问题

    我目前正在从事一个相对较大的项目 使用 AngularJs 构建 应用程序的一部分是一个表单 您可以向其中添加任意数量的页面 不幸的是 添加了很多不必要的垃圾 即表示表单模型的对象可能会变得非常大 在某些时候 Chrome 基本上无法处理它
  • 如何更改 Google Maps v3 API for Directions 中的开始和结束标记图像

    我使用 DirectionsRender 绘制了一条路线 但我不知道如何用我自己的标记替换通用的 Google 标记 我知道并在正常的谷歌地图情况下使用它 但发现很难用开始和结束的方向标记来做到这一点 如果这是一个愚蠢的问题 感谢您的任何建
  • 摩卡 - Chai Karma“套件未定义”

    我对 jscript tdd 很陌生 遇到了问题 希望有人能告诉我我在做什么 在浏览器中运行测试 通过 HTML 文件 一切正常 通过节点和业力运行它们我得到以下异常 我想在 node js 主机的 karma 中使用 Mocha 和 Ch
  • 带有淘汰赛js的隐形recaptcha

    我正在完成隐形验证码 但我在实现它时遇到问题 谷歌开发人员页面中的代码显示它应该是这样的
  • 使用 dc.js 按条形值对条形图中的条形进行排序(排序)

    如何通过维度的计算值而不是维度本身的名称对 dc js 示例中的 x 轴 维度 进行排序 例如 请考虑序数条形图的 dc js 示例 https github com dc js dc js blob master web examples
  • Bootstrap按钮加载+Ajax

    我正在使用 Twitter Bootstrap 的按钮加载状态 http twitter github com bootstrap javascript html buttons http twitter github com bootst
  • 防止 iOS 键盘在 cordova 3.5 中滚动页面

    我正在使用 Cordova 3 5 和 jQuery mobile 构建 iOS 应用程序 我在大部分应用程序中禁用了滚动功能 但是 当我选择输入字段时 iOS 键盘会打开并向上滚动页面 我不想要这个功能 由于输入足够高 键盘不会覆盖它 我
  • 尝试将数据存储在点击器网站中

    我正在尝试存储一个名为的变量score无论何时刷新 您都会一次又一次地使用它 我不明白的是它的代码是什么 我尝试了一些方法 但似乎都不起作用 这是我的答题器网站 但是当我尝试使用 JavaScript 来存储它时 它不起作用window o
  • 如何解决 Typescript 构建中的错误“找不到模块 'jquery'”

    我目前在 ts 文件的顶部有这个import require jquery 我这样做是因为我试图在我的打字稿文件中使用 jquery 但我似乎无法编译它 因为它返回标题中所述的错误 我正在使用 ASP NET CORE 脚本文件夹 tsco
  • 在 HTML5 画布中,如何用我选择的背景遮盖图像?

    我试图用画布来实现这一点 globalCompositeOperation 但没有运气 所以我在这里问 这里有类似的问题 但我没有在其中找到我的案例 我的画布区域中有图层 从下到上的绘制顺序 画布底座填充纯白色 fff 用fillRect
  • window.location 和 location.href 之间的区别

    我对之间的区别感到困惑window location and location href 两者似乎都以相同的方式行事 有什么不同 window location是一个对象 它保存有关当前文档位置的所有信息 主机 href 端口 协议等 lo
  • 有没有办法在 onclick 触发时禁用 iPad/iPhone 上的闪烁/闪烁?

    所以我有一个有 onclick 事件的区域 在常规浏览器上单击时 它不会显示任何视觉变化 但在 iPad iPhone 上单击时 它会闪烁 闪烁 有什么办法可以阻止它在 iPad iPhone 上执行此操作吗 这是一个与我正在做的类似的示例
  • 从数据库检查数据的异步解决方案各种循环子句

    我想要做的是异步检查数据库并从中获取结果 在我的应用程序中我试图实现Asynchronously将此步骤解决为 从数据库中检查手机号码JsonArray循环子句的种类 Create JsonArray从结果 打印创建的数组 我学到了足够多的
  • Three.js 各种大小的粒子

    我是 Three js 的新手 正在尝试找出添加 1000 个粒子的最佳方法 每个粒子都有不同的大小和颜色 每个粒子的纹理是通过绘制画布创建的 通过使用粒子系统 所有粒子都具有相同的颜色和大小 为每个粒子创建一个粒子系统是非常低效的 有没有
  • 在 Javascript 中连接空数组

    我正在浏览一些代码 我想知道这有什么用处 grid push concat row 根据我的理解 它等同于 grid push row 为什么要大惊小怪 连接 你想使用 concat当您需要展平数组并且没有由其他数组组成的数组时 例如 va
  • 在 Shopify 商店中嵌入 Vue 组件

    在产品页面中 我尝试显示自定义 Vue 组件 为简洁起见 该组件根据给定的产品 ID 显示 Firebase 数据库中的一些信息 我最初尝试将其制作为 Shopify 应用程序 以便我可以访问他们的 API 我实现了 OAuth 并且可以检
  • 从 FileReader 设置背景图像样式

    我正在寻找一种解决方案 允许我从文件上传输入中获取文件并通过设置 document body style backgroundImage 来预览它 以下代码用于在 Image 元素中显示预览 function setImage id tar
  • HTML 锚点,禁用样式

    我有一些 html 锚链接代码 与文档的其余部分不同 我希望它看起来不是链接 有没有一种简单的方法可以禁用由于将文本包装在锚标记中而引起的样式更改 而不必强行使其相同 即 如果我更改正文字体样式 我不必也更改其他一些 link东西 将颜色设
  • Jquery - 选择选项后如何获取选项的特定数据类型?

    我将直接跳到标记 然后解释我想要做什么 HTML 选择选项

随机推荐

  • 创建图像对象数组

    我正在尝试创建一系列图像对象 但很困难 每个对象将包含一个图像和图像的标题 当我将以下代码粘贴到 Firebug 中进行检查时 它工作正常 实施例1 var imageArray new Array imageArray 0 new Ima
  • 使用 REGEX 用可变长度零填充数字

    我遇到一种情况 客户端输入一个数字 我需要通过在其前面填充一定数量的零来验证该数字 我验证的字段的最大长度是 9 位数字 因此如果客户端输入 123 我需要在其前面填充 6 个零并进行验证 听起来很容易 对吧 好吧 这是最关键的 我对过程的
  • Codeigniter 连接模型中的两个表

    我想在我的模型中加入 2 个表 但它不起作用 这是我现在的模型 function list get id this gt load gt database query this gt db gt get where lists array
  • 如何使用 GET/POST 和 Token key 基于 Ajax 调用 ASP.NET Web API

    我知道如何将 Ajax 与 GET POST 数据一起使用 如下代码所示 但我不知道如何将其与 Token key 一起使用 已获得 Token key read1 click function support cors true ajax
  • C++ 未声明的标识符错误

    我得到一个未声明的标识符错误 我不知道为什么 我什至重写了完整的内容以确保我没有犯错 有人能告诉我为什么会出现这个错误吗 我的文件是 连接 hpp pragma once include LogicSimulator hpp include
  • 如何使用 thymeleaf 递归渲染菜单

    我想使用 ul li 列表呈现 HTML 菜单 我有这个类结构 public class MenuItem private String name private MenuItem parent private List
  • ASP.NET MVC:出现空 ActionLink

    我使用默认路由 因此不需要指定控制器 routes MapRoute Default action id new controller Home action Index id UrlParameter Optional 有了这个 我可以创
  • 在 C 中传递二维指针数组

    对于我的程序 我需要将一个二维指针数组传递给单独文件中的函数 我在下面编写了一个类似语法的文件 include
  • 使用 py2exe 捆绑时导入错误

    我使用 py2exe 捆绑了一个用 python 编写的小脚本 该脚本使用了许多包 其中之一是reportlab 使用 py2exe 捆绑后 我尝试运行可执行文件 但它返回以下错误 C Python26 dist gt DELchek ex
  • 在Python中调用C函数并返回2个值

    我试图弄清楚如何从我在 python 中调用的 C 函数返回 2 个值 我已阅读在线材料并使用 struct 输出这两个变量 当我在同一个 C 文件中调用此函数时 我能够输出变量 然而 当我尝试在 python 中调用它时 它仍然只返回一个
  • 外部存储上应用程序特定文件夹的权限

    有人可以解释一下应用程序特定文件夹的权限吗 Android data lt package name gt files 如此处所述http developer android com guide topics data data stora
  • 处理字母数字字符时 ksort 会产生错误的结果

  • 是否可以从获取的 url 而不是规范的 url 中提取元数据?

    我有一个像这样的 Facebook 链接到我没有完全控制权的页面 我可以修改但不是页面的 因此 我尝试在我拥有完全控制权的新页面上设置 like 按钮的链接 在此页面上设置opengraph元标记 并设置一个链接到原始页面的og url 但
  • 如何捕获全局异常?

    有没有办法捕捉global代码中的 崩溃 应用程序异常 例如 objc exception throw EXC ARITHMETIC 等 我需要它 因为我想在应用程序被系统杀死之前做一些事情 您可以使用以下方法为任何未捕获的异常设置处理程序
  • MySQL查询从一个表中获取最佳排名并用另一个表更新结果

    我有一个排名板 列出了每种性别 男性和女性 的前 100 个最佳博客 我有一个博客表 PRIMARY blogs id users id blogs score blogs score time gender 1 11 2852 2015
  • 如何使用天蓝色连接字符串覆盖本地连接字符串

    我在 Net core 项目中使用 appsettings json 作为连接字符串 我的连接字符串是 ConnectionStrings OT DB Connection Data Source 108 Initial Catalog O
  • 运行 Composer Laravel 8 时出现 Symfony 进程错误

    突然在我的 Laravel 8 项目中 我运行了 Composer 来卸载一个依赖项 我想重新安装该依赖项 只是为了顺序并从头开始 我开始抛出这个与 Symfony Process 有关的错误 PHP 致命错误 未捕获的类型错误 fclos
  • 如何将每个 DStream 保存/插入到永久表中

    我一直面临着 Spark Streaming 的问题 关于将输出 Dstream 插入到永恒的SQL 表 我想将每个输出 DStream 来自 Spark 处理的单个批次 插入到一个唯一的表中 我一直在使用 Python 和 Spark 版
  • 在Java中禁用键盘/鼠标

    我正在开发一个程序 它允许用户锁定计算机 这样其他人就不能使用它 无论如何 我可以禁用鼠标和键盘上的特定键吗 谢谢 不 但是您可以创建让程序锁定屏幕 然后使用 MouseMovementListener 以便每次鼠标移动时 您都以编程方式将
  • 使用 Javascript 选定单词的索引

    如何使用 Javascript 获取 HTML 中选定文本的索引 例如 在一个 HTML 文件中 有如下段落 我住在印度 印度是一个非常美丽的国家 现在如果用户选择India在第一句话中应该有一个alert 5如果用户选择India第二行然