nicEditor и OnChange событие с помощью JQuery

Question

Я использовал более 5 nicEditors в моем application.Below мой код

$(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') 
      ) 
     ); 
    }); 

}); 

В том, что я хочу, чтобы добавить событие OnChange с drag_words_paragraph textarea.onchange текста он будет добавить в один div..I пытался как этот

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 ошибки() не function.Please кто поможет me.I борется за это errorlongtime.Thanks заранее

Answer 1

В вашем коде вы объявляете новый PaneInstance для одного ID более одного раза.

попробовать изменить свой код, как показано ниже

//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>