我想添加一个按钮来添加<hr>
标记到quill.js(测试版) http://beta.quilljs.com/docs/quickstart/ editor.
这里的fiddle https://jsfiddle.net/Lgxkj4ag/.
<!-- Initialize Quill editor -->
<div id="toolbar-container">
<span class="ql-formats">
<button class="ql-hr"></button> //here my hr-button
</span>
<span class="ql-formats">
<button class="ql-bold"></button>
<button class="ql-italic"></button>
</span>
</div>
<div id="editor">
<p>Hello World!</p>
<hr> // this gets replaced by <p> tag automatically *strange*
<p>Some initial <strong>bold</strong> text</p>
</div>
我初始化我的编辑器:
var quill = new Quill('#editor', {
modules: {
toolbar: '#toolbar-container'
},
placeholder: 'Compose an epic...',
theme: 'snow'
});
这里我添加一个<h1>
我的编辑器的标签功能非常好用:
$('.ql-hr').on("click",function(){
var range = quill.getSelection();
var text = quill.getText(range.index, range.length);
quill.deleteText(range.index, range.length);
quill.pasteHTML(range.index, '<h1>'+text+'</h1>');
})
现在我尝试同样的方法<hr>
标签,根本不起作用:
$('.ql-hr').on("click",function(){
var range = quill.getSelection();
quill.pasteHTML(range.index, '<hr>');
})
the <hr>
初始标签div#editor
被替换为<p>
标签。我添加的按钮功能不起作用<hr>
标签,但对于其他标签它也有效。我知道<hr>
标签没有实现到 Quill.js,这也是我得到这个控制台输出的原因:
quill:工具栏忽略附加到不存在的格式 hr select.ql-hr
有没有什么办法解决这一问题?