[英]nicEditor and onchange event using JQuery
我在我的應用程序中使用了超過 5 個 nicEditors。下面是我的代碼
$(document).ready(function() {
bkLib.onDomLoaded(function() {
nicEditors.editors.push(
new nicEditor().panelInstance(
document.getElementById('single_answer_description')
)
);
});
bkLib.onDomLoaded(function() {
nicEditors.editors.push(
new nicEditor().panelInstance(
document.getElementById('multiple_answer_description')
)
);
});
bkLib.onDomLoaded(function() {
nicEditors.editors.push(
new nicEditor().panelInstance(
document.getElementById('drag_words_paragraph')
)
);
});
bkLib.onDomLoaded(function(){
var myInstance = new nicEditor().panelInstance('drag_words_paragraph');
myInstance.addEvent('blur', function() {
alert("m");
});
});
bkLib.onDomLoaded(function() {
nicEditors.editors.push(
new nicEditor().panelInstance(
document.getElementById('drop_words_paragraph')
)
);
});
});
因為我想用 drag_words_paragraph textarea.onchange 的文本添加 onchange 事件,它將添加到一個 div 中..我試過這樣
bkLib.onDomLoaded(function(){
var myInstance = new nicEditor().panelInstance('drag_words_paragraph');
myInstance.addEvent('blur', function() {
// Your code here that is called whenever the user blurs (stops editing) the nicedit instance
});
});
但我無法得到確切的結果,而是我得到錯誤 removeInstance() 不是一個函數。請任何人幫助我。我正在為這個錯誤而苦苦掙扎。提前謝謝
在您的代碼中,您不止一次為相同的 ID 聲明新的 PaneInstance。
嘗試更改您的代碼如下
//declare a global variable to store the editor text
var drag_words_paragraph;
$(document).ready(function() {
// assign the text to variable
window.drag_words_paragraph = $('#drag_words_paragraph').text();
bkLib.onDomLoaded(function() {
nicEditors.editors.push(
new nicEditor().panelInstance(
document.getElementById('single_answer_description')
)
);
});
bkLib.onDomLoaded(function() {
nicEditors.editors.push(
new nicEditor().panelInstance(
document.getElementById('multiple_answer_description')
)
);
});
bkLib.onDomLoaded(function() {
nicEditors.editors.push(
var myInstance = new nicEditor().panelInstance('drag_words_paragraph');
myInstance.addEvent('blur', function() {
debugger;
var text = this.instanceById('drag_words_paragraph').getContent();
if (window.drag_words_paragraph == text) {
//Text has not been changed
return false;
} else {
//Text has been changed
//You can call your functions here.
alert('text changed');
window.drag_words_paragraph = text;
}
});
)
);
});
您的代碼似乎正在運行。
正如Richard Welsh
在http://wiki.nicedit.com/w/page/518/Editor%20Events 中所評論的
根據他的解決方法檢查下面的代碼段。
$(function() { $('#drag_words_paragraph_text').text($('#drag_words_paragraph').text()); var myInstance = new nicEditor({ iconsPath: 'https://cdn.jsdelivr.net/nicedit/0.9r24/nicEditorIcons.gif' }).panelInstance('drag_words_paragraph'); myInstance.addEvent('blur', function() { debugger; var hiddenElem = $('#drag_words_paragraph_text'); var text = this.instanceById('drag_words_paragraph').getContent(); if ($(hiddenElem).text() == text ) { return false; } else { alert('text changed'); $(hiddenElem).text(text); } }); }); function changeText(){ var newText = $('#change_text').val(); nicEditors.findEditor('drag_words_paragraph').setContent(newText); }
body { min-height: 500px; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://cdn.jsdelivr.net/nicedit/0.9r24/nicEdit.js"></script> <textarea class="form-control" style="width: 300px; height: 100px;" name="drag_words_paragraph" id="drag_words_paragraph"> Some random text </textarea> <div style="display:none" id="drag_words_paragraph_text"></div> <br/> <textarea id="change_text" placeholder="enter some text here" ></textarea> <button id="change_text_btn" onclick="changeText();">change text</button>
嘗試這個:
document.querySelector('.nicEdit-main').addEventListener("input", function(e) {
console.log(e.target.innerHTML)
}, false);
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.