我正在尝试为链接输入值编写一个自定义处理程序。如果用户输入的链接没有自定义协议,我希望http:
在输入值之前加上a 。这是因为,如果链接值缺少http :,则不会解释链接,about:blank
并显示为intead。(https://github.com/quilljs/quill/issues/1268#issuecomment-272959998)
这是我写的(类似于此处的官方示例):
toolbar.addHandler("link", function sanitizeLinkInput(linkValueInput) { console.log(linkValueInput); // debugging if (linkValueInput === "") this.quill.format(false); // do nothing, since it implies user has just clicked the icon // for link, hasn't entered url yet else if (linkValueInput == true); // do nothing, since this implies user's already using a custom protocol else if (/^\w+:/.test(linkValueInput)); else if (!/^https?:/.test(linkValueInput)) { linkValueInput = "http:" + linkValueInput; this.quill.format("link", linkValueInput); } });
每次用户单击链接图标,都不会发生任何情况,并且true
会记录到控制台。我实际上希望在人们单击链接图标后在显示的工具提示上单击“保存”时执行此处理程序。
任何想法如何做到这一点?还提示或建议。
谢谢!
汇总所有信息
snow主题本身使用工具栏的addHandler来显示工具提示,因此无法使用addHandler方法来实现我们想要的目标。
因此,我们可以执行以下操作:
var Link = Quill.import('formats/link'); var builtInFunc = Link.sanitize; Link.sanitize = function customSanitizeLinkInput(linkValueInput) { var val = linkValueInput; // do nothing, since this implies user's already using a custom protocol if (/^\w+:/.test(val)); else if (!/^https?:/.test(val)) val = "http:" + val; return builtInFunc.call(this, val); // retain the built-in logic };
该方法不会挂接到处理程序上,而是会修改内置的清除逻辑本身。我们还保留了消毒的原始行为,因此不会修改编辑者的原始行为。
或者,我们实际上可以使用此代码来钩住工具提示的“保存”按钮。但是,与上述方法相比,该方法太长了。