Je souhaite ajouter un bouton qui permettrait d'ajouter un <hr>
tag de la quill.js (bêta) de l'éditeur.
Ici le violon.
<!-- 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>
J'initialise mon éditeur:
var quill = new Quill('#editor', {
modules: {
toolbar: '#toolbar-container'
},
placeholder: 'Compose an epic...',
theme: 'snow'
});
Ici, j'ai ajouter un <h1>
fonctionnalités de balise à mon éditeur et il fonctionne très bien:
$('.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>');
})
J'essaie maintenant de faire la même chose pour un <hr>
balise, qui ne fonctionne pas du tout:
$('.ql-hr').on("click",function(){
var range = quill.getSelection();
quill.pasteHTML(range.index, '<hr>');
})
l' <hr>
balise dans la première div#editor
sera remplacé par un <p>
balise. Et la fonctionnalité du bouton, j'ai ajouté doensn pas de travail pour <hr>
tags, mais pour les autres balises, il fonctionne. Je sais que l' <hr>
balise n'est pas mis en œuvre pour Quill.js, c'est aussi pourquoi je obtenir cette sortie de la console:
plume:barre d'outils en ignorant attachant, voire inexistante format rh sélectionner.ql-rh
Est-il possible de résoudre ce problème?