草庐IT

javascript - 在与 jQuery UI 对话框和文本输入交互时，在 contenteditable 中保留文本选择

coder 2024-05-08 原文

我有一个 jQuery 对话框，用于在 contentEditable 范围内创建链接。问题是单击按钮打开对话框会导致选择丢失，对话框内的文本输入也会导致选择丢失。

我可以用 -moz-user-select:none 修复按钮；但是 -webkit-user-select:none 在 Chrome 中不起作用。

我可以通过将输入包装在 iframe 中来修复输入，但这很困惑，点击其他任何地方也会杀死选择，例如，拖动对话框。

我在 How to preserve text selection when opening a jQuery dialog 看到了解决方案，但这在许多浏览器中的 contenteditable 元素中不起作用，只能用于真实输入。

我的问题有好的解决方案吗？

最佳答案

当对话框打开和关闭时，您可以使用如下简单的函数保存和恢复选择。我对 jQuery 对话框不够熟悉，不知道 Hook 到对话框打开和关闭的机制。第一个是 saveSelection，返回一个 Range 或 TextRange 对象，您应该将其存储在稍后传递给 restoreSelection<>:

function saveSelection() {
    if (window.getSelection) {
        sel = window.getSelection();
        if (sel.getRangeAt && sel.rangeCount) {
            return sel.getRangeAt(0);
        }
    } else if (document.selection && document.selection.createRange) {
        return document.selection.createRange();
    }
    return null;
}

function restoreSelection(range) {
    if (range) {
        if (window.getSelection) {
            sel = window.getSelection();
            sel.removeAllRanges();
            sel.addRange(range);
        } else if (document.selection && range.select) {
            range.select();
        }
    }
}

关于javascript - 在与 jQuery UI 对话框和文本输入交互时，在 contenteditable 中保留文本选择，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/3315824/

和文contenteditablesectioncodeselectionjavascriptjquery

有关javascript - 在与 jQuery UI 对话框和文本输入交互时，在 contenteditable 中保留文本选择的更多相关文章

  1. ruby-on-rails - 如何在 ruby​​ 交互式 shell 中有多行？ - 2

    这可能是个愚蠢的问题。但是，我是一个新手......你怎么能在交互式ruby​​shell中有多行代码？好像你只能有一条长线。按回车键运行代码。无论如何我可以在不运行代码的情况下跳到下一行吗？再次抱歉，如果这是一个愚蠢的问题。谢谢。 最佳答案 这是一个例子:2.1.2:053>a=1=>12.1.2:054>b=2=>22.1.2:055>a+b=>32.1.2:056>ifa>b#Thecode‘if..."startsthedefinitionoftheconditionalstatement.2.1.2:057?>puts"f

  2. ruby-on-rails - 简单的 Ruby on Rails 问题——如何将评论附加到用户和文章？ - 2

    我意识到这可能是一个非常基本的问题，但我现在已经花了几天时间回过头来解决这个问题，但出于某种原因，Google就是没有帮助我。(我认为部分问题在于我是一个初学者，我不知道该问什么......)我也看过O'Reilly的RubyCookbook和RailsAPI，但我仍然停留在这个问题上.我找到了一些关于多态关系的信息，但它似乎不是我需要的(尽管如果我错了请告诉我)。我正在尝试调整MichaelHartl'stutorial创建一个包含用户、文章和评论的博客应用程序(不使用脚手架)。我希望评论既属于用户又属于文章。我的主要问题是:我不知道如何将当前文章的ID放入评论Controller。

  3. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法？ - 2

    我遇到了一个非常奇怪的问题，我很难解决。在我看来，我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时，我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性，其中包括href和data-method。再次单击此链接后，我的服务器收到了对新href的请求，但使用的是旧的data-method，即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是，如果我刷新页面，HTML与"new"HTML相同(随返回的JS发生变化)，但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  4. ruby-on-rails - 如何在 Rails 3 中保存到数据库之前格式化值 - 2

    我有一个带有利润字段的用户模型。利润字段是DECIMAL(11,0)类型。我在表单上有一个屏蔽输入，允许用户输入1,000美元之类的内容。我想格式化该值并从中删除除数字以外的所有内容，这样我将保存1000。这是我到目前为止所拥有的:classUser但它一直在数据库中保存0。看起来它在我的格式化函数之前将其转换为十进制。 最佳答案 试试这个:defprofit=(new_profit)self[:profit]=new_profit.gsub(/[^0-9]/,'')end 关于ruby

  5. ruby - 在 Mechanize 中使用 JavaScript 单击链接 - 2

    我有这个:AccountSummary我想单击该链接，但在使用link_to时出现错误。我试过:bot.click(page.link_with(:href=>/menu_home/))bot.click(page.link_with(:class=>'top_level_active'))bot.click(page.link_with(:href=>/AccountSummary/))我得到的错误是:NoMethodError:nil:NilClass的未定义方法“[]” 最佳答案 那是一个javascript链接。Mechan

  6. ruby-on-rails - 将 Ruby 代码和文字标记与 Haml 混合 - 2

    如何用HAML编写这个ERB:#OR我可以:=some_ruby_code+":"#and=some_ruby_code%br但我不想在这里连接，我想将它写成内联:(=some_ruby_code):#and(=some_ruby_code)%br 最佳答案 =some_ruby_code+":"-#and=some_ruby_code+""编辑1:我不确定您在寻找什么。你想要其中之一吗？==#{some_ruby_code}:-#and==#{some_ruby_code}或==#{some_ruby_code}:-#and=so

  7. javascript - jQuery 的 jquery-1.10.2.min.map 正在触发 404(未找到) - 2

    我看到有关未找到文件min.map的错误消息:GETjQuery'sjquery-1.10.2.min.mapistriggeringa404(NotFound)截图这是从哪里来的？ 最佳答案 如果ChromeDevTools报告.map文件的404(可能是jquery-1.10.2.min.map、jquery.min.map或jquery-2.0.3.min.map，但任何事情都可能发生)首先要知道的是，这仅在使用DevTools时才会请求。您的用户不会遇到此404。现在您可以修复此问题或禁用sourcemap功能。修复:获取文

  8. ruby-on-rails - 如何在 Rails 2 中保存上传的文件 - 2

    您好，我在Rails2应用程序中集成了ZohoSheet，我可以从本地打开新的ZohoSheet，但是当我在zoho编辑器中单击保存时，它会将文件发送到我的服务器，这是我的生产日志ProcessingZohoController#indexto#(for*.*.*.*at2015-10-0811:24:08)[POST]Parameters:{"controller"=>"zoho","filename"=>#,"content"=>#,"eventsource"=>#,"format"=>#,"id"=>#,"action"=>"index"}ActionController::In

  9. ruby-on-rails - 我将 Rails3 与 tinymce 一起使用。如何呈现用户关闭浏览器javascript然后输入xss？ - 2

    我有一个用Rails3编写的站点。我的帖子模型有一个名为“内容”的文本列。在帖子面板中，html表单使用tinymce将“content”列设置为textarea字段。在首页，因为使用了tinymce，post.html.erb的代码需要用这样的原始方法来实现。.好的，现在如果我关闭浏览器javascript，这个文本区域可以在没有tinymce的情况下输入，也许用户会输入任何xss，比如alert('xss');.我的前台会显示那个警告框。我尝试sanitize(@post.content)在posts_controller中，但sanitize方法将相互过滤tinymce样式。例如

  10. ruby-on-rails - 使用 Ruby on Rails 处理回形针文件夹和文件权限 - 2

    我在运行Ubuntu10.04LTS的远程VPS机器上以生产模式运行RubyonRails3.0.9(在开发模式下，我在MACOSSnow上使用RoRLeopard)，我想知道如何管理以下场景。我使用Apache2和PhusionPassenger并且我将虚拟主机设置为如下所示:ServerNameproject_name.comDocumentRoot/srv/www/project_name.com/publicAllowOverrideallOptions-MultiViews此外，我使用Paperclipgem，由于网上很多人在生产模式下使用它，我在处理(图像)文件时遇到以下错

随机推荐