ویرایشگر متن Quill
نمونه پایه
نوشتن پیام
<div class="card card-custom">
<div class="card-header">
<h3 class="card-title">
نمونه پایه
</h3>
</div>
<div class="card-body">
<div id="kt_quil_1" style="height: 325px">
نوشتن پیام
</div>
</div>
</div>
// کلاس definition
var KTQuilنسخه ی نمایشیs = function() {
// خصوصی functions
var demo1 = function() {
var quill = new Quill('#kt_quil_1', {
modules: {
toolbar: [
[{
header: [1, 2, false]
}],
['bold', 'italic', 'underline'],
['image', 'code-block']
]
},
placeholder: 'نوع your text here...',
theme: 'snow' // or 'bubble'
});
}
return {
// public functions
init: function() {
demo1();
demo2();
}
};
}();
jQuery(document).ready(function() {
KTQuilنسخه ی نمایشیs.init();
});
ذخیره خودکار
نوشتن پیام
<div class="card card-custom">
<div class="card-header">
<h3 class="card-title">
ذخیره خودکار
</h3>
</div>
<div class="card-body">
<div id="kt_quil_2" style="height: 325px">
نوشتن پیام
</div>
</div>
</div>
// کلاس definition
var KTQuilنسخه ی نمایشیs = function() {
// خصوصی functions
var demo2 = function() {
var Delta = Quill.import('delta');
var quill = new Quill('#kt_quil_2', {
modules: {
toolbar: true
},
placeholder: 'نوع your text here...',
theme: 'snow'
});
// Store accumulated changes
var change = new Delta();
quill.on('text-change', function(delta) {
change = change.compose(delta);
});
// ذخیره periodically
setInterval(function() {
if (change.length() > 0) {
console.log('Saving changes', change);
/*
ارسال partial changes
دلار.post('/your-endpoint', {
partial: جی اسON.stringify(change)
});
ارسال entire document
دلار.post('/your-endpoint', {
doc: جی اسON.stringify(quill.getContents())
});
*/
change = new Delta();
}
}, 5 * 1000);
// Check for unsaved data
window.onbeforeunload = function() {
if (change.length() > 0) {
return 'There are unsaved changes. Are you sure you want to leave?';
}
}
}
return {
// public functions
init: function() {
demo2();
}
};
}();
jQuery(document).ready(function() {
KTQuilنسخه ی نمایشیs.init();
});
