如何在 Quill 编辑器中预填充 http 链接?

2023-11-24

使用 Quill 编辑器添加链接时,我必须包含协议,否则链接将被视为相对链接。

当有人单击添加链接时,我希望该字段预先填充http://所以当用户输入google.com它将创建一个链接到http://google.com代替http://myapp.net/something/google.com.

堆栈溢出是这样的...

enter image description here


当您尝试保存现有链接时,上述解决方案将不起作用。此外,它还忽略其他协议,例如(mailto, tel, https)

这是一个更好的解决方案:

let Link = window.Quill.import('formats/link');

class CustomLink extends Link {
      
  static sanitize(url) {
    let value = super.sanitize(url);
    if (value) {
      for (let i = 0; i < this.PROTOCOL_WHITELIST.length; i++)
        if(value.startsWith(this.PROTOCOL_WHITELIST[i]))
          return value;

        return `http://${value}`
    }
    return value;
  }
}
Quill.register(CustomLink);
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何在 Quill 编辑器中预填充 http 链接? 的相关文章

随机推荐

  • 使用 DataContractSerializer 进行简单的数据文件版本控制

    读过数据合同版本控制我们得出的结论是 这并不是故事的全部 例如 如果您以前有 ValueA 而在新版本中它现在称为 ValueB 并且是不同的类型 并且您需要将 ValueA 转换为 ValueB 会发生什么情况 有一些回调我可以用来帮助解
  • 使用ConfigParser读取没有节名的文件

    我在用ConfigParser读取脚本的运行时配置 我希望具有不提供部分名称的灵活性 有些脚本足够简单 它们不需要 部分 ConfigParser会抛出一个NoSectionError异常 并且不会接受该文件 我怎样才能让 ConfigPa
  • 从 webdriver.io 获取数据后动态构建 Mocha 测试

    我正在寻找一种解决方案来在异步获取数据后定义 Mocha 测试 目前 我使用gulp webdriver使用 Selenium 获取 HTML 内容 我想测试某些 HTML 标签结构 例如 我想从 HTML 页面获取所有按钮结构 1 在 M
  • C 中的 sin v/s sinf 函数

    我正在尝试使用sinf函数在我的 C 程序中 但它在 MSVC 6 0 下给了我一个未定义的引用错误sin工作正常 这让我很好奇找到两者之间的区别sin and sinf 两者之间的逻辑区别是什么sin and sinf 我怎样才能实现我自
  • 如何知道是什么使休眠持久对象变脏?

    我用 hibernate 映射的对象有奇怪的行为 为了知道为什么该对象行为异常 我需要知道是什么使该对象变脏 有人可以帮助并给我提示吗 该对象是 Java Spring 上下文中的 Java 类 所以我更喜欢针对 Java 平台的答案 编辑
  • jQuery ajaxForm 返回 .json 文件

    我在 Rails 中有一个模型创建表单 我还通过 ajax 返回 JSON 到目前为止我的代码看起来像 new stem ajaxForm new stem is my form dataType json success formSucc
  • 将 JSON 日期信息解析为 C# DateTime

    我有一个返回 CLR 对象的 WCF 服务 该对象定义如下 DataContract public class Person DataMember public string FullName get return fullName set
  • Angular2 通过 Promise 获取路由的参数

    嘿 我尝试过以下代码 constructor private route ActivatedRoute ngOnInit this route params toPromise then data gt 然而它没有做任何事情 如果我交换to
  • PHP 警告:mysqli_stmt::bind_param():变量数量与准备好的语句中的参数数量不匹配

    不知道为什么我会收到此 PHP 警告消息 看来准备好的语句中有四个参数 bind param 中也有四个变量 谢谢你的帮助 if stmt mysqli gt prepare SELECT url month year cover imag
  • C++ 常量结构体成员初始化

    我有一个常数struct timespec我班的成员 我应该如何初始化它 我唯一疯狂的想法就是衍生出我自己的想法timespec并给它一个构造函数 非常感谢 include
  • 在 Gmail 中撰写邮件的 URL(具有完整的 Gmail 界面并指定收件人、密件抄送、主题等)

    我找到了一个post它提供了一个仅打开撰写消息窗口的链接示例 但是 我希望它打开一个窗口完整的 Gmail 界面但已准备好撰写新消息 当然这有效 https mail google com mail u 0 compose 但是 我还想添加
  • Go - 通过外部命令写入标准输入

    我有以下代码 它执行外部命令并将两个字段输出到控制台等待用户输入 一个用于用户名 另一个用于密码 然后我手动添加了它们 谁能给我提示如何写入标准输入以便从程序内部输入这些输入 对我来说 棘手的部分是有两个不同的字段等待输入 而我很难弄清楚如
  • 仅转置 data.frame 中的某些列

    这里是我有数据 am group v1 v2 v3 v4 1 2015 10 31 A 693 803 700 17 2 2015 10 31 B 524 859 302 77 3 2015 10 31 C 266 675 86 7 4 2
  • kubernetes 的外部 IP 在 minikube 中显示

    我对 Kubernetes 相当陌生 最近我使用 miniKube 公开了一项服务NodePort类型 我想测试我的应用程序的运行 但我没有看到任何外部 IP 只看到端口 这是我的输出 kubectl get service NAME CL
  • iOS Safari 和 Chrome 上的 Z 索引问题

    我遇到了基于 wordpress Underscores 主题的响应式下拉菜单的问题 它在桌面上看起来不错 但在 iOS Safari 上 包括 iPad 和 iPhone 则不然 我也尝试将 z index 添加到其他 div 但它不起作
  • Ajax 文件上传,“进度”上传事件在 Edge 浏览器中不会触发

    我正在开发一个文件上传控件 通过 ajax 发布表单数据 我在 Chrome Firefox IE 11 10 中可以使用此跨浏览器 但是在 Microsoft Edge 浏览器中 上传 进度 事件似乎不会触发 谁能指出原因并告诉我 Edg
  • make -j 8 g++:内部编译器错误:已杀死(程序 cc1plus)

    当我在 Ubuntu12 04 上部署 Apache Mesos 时 我按照官方文档进行操作 在步骤 make j 8 中 我在控制台中收到此错误 g internal compiler error Killed program cc1pl
  • 左外连接和右外连接哪个更好?

    我们可以通过这两种方式得到相同的结果 Table 1 LEFT OUTER JOIN Table 2 Table 2 RIGHT OUTER JOIN Table 1 如果我们能得到相同的结果为什么要使用右外连接 哪一个更好 正如其他人已经
  • pdfBox - 签名有效性复选标记在 Acrobat reader 中不可见

    我正在使用此作为参考向 pdf 添加视觉签名 https stackoverflow com a 27940667 7103795 我能够正确打印详细信息 但在 Acrobat 中打开 pdf 时 它不会显示绿色勾号 尽管它写着 已签名且所
  • 如何在 Quill 编辑器中预填充 http 链接?

    使用 Quill 编辑器添加链接时 我必须包含协议 否则链接将被视为相对链接 当有人单击添加链接时 我希望该字段预先填充http 所以当用户输入google com它将创建一个链接到http google com代替http myapp n