如何在文本模式的tinymce中添加事件監聽器

我想通過tinymce檢測用戶在wordpress中的輸入。但文本模式不起作用。如何在文本模式的tinymce中添加事件監聽器

只有當我第一次使用視覺模式，然後切換文本模式，文本才能被檢測到。

tinymce.PluginManager.add('keyup_event', function(editor, url) { 
    // Create keyup event 
    editor.on('keyup', function(e) { 

    // Get the editor content (html) 
    get_ed_content = tinymce.activeEditor.getContent(); 
    // Do stuff here... (run do_stuff_here() function) 
    console.log(tinyMCE.activeEditor); 
    do_stuff_here(get_ed_content); 
    if (get_ed_content.indexOf("&lt;iframe&gt;") > 0 && flag1 === true) { 
     createMessage(); 
    } else if (get_ed_content.indexOf("&lt;iframe&gt;") < 0) { 
     flag1 = true; 
     $('#detect').remove(); 
    } 
    }); 
}); 

$('#content').on('keyup', function(e) { 
    get_ed_content = $('#content').val(); 
    // get_ed_content = tinymce.activeEditor.getContent(); 
    do_stuff_here(get_ed_content); 
    console.log(tinyMCE.activeEditor); 
    if (get_ed_content.indexOf("<iframe>") > 0 && flag2 === true) { 
    createMessage(); 
    } else if (get_ed_content.indexOf("<iframe>") < 0){ 
    flag2 = true; 
    $('#detect').remove(); 
    } 
});

來源

2017-04-19 Cristi

我已經推杆代碼jQuery中 – Cristi

如果我理解正確，您正試圖獲取選定/標記的內容。例如，如果我標記永久鏈接，那麼我會得到bla。如果是這樣，你需要做的是 -

ed.addButton ('remark', { // Remark Text 
     title : 'Remark Text', 
     image: url + '../../images/remark-icon.png', 
     onClick : function() { 
      var state = true; 
      ed.focus(); 

      ed.controlManager.setActive('remark', state); 

      var text = ed.selection.getContent({format : 'text'}); 

      var selected_elem = ed.selection.getNode(); // Get selected element 
      selected_elem = jQuery(selected_elem); // Get element's class 
      var elem_type = ed.selection.getNode().nodeName; // Get element type 

      if(elem_type !== 'SPAN') { 
       ed.selection.setContent('<span class="remark-text">' + text + '</span>'); 
      } 
      else { 
       var selected_content = ed.selection.getNode(); 
       var stripped_content = selected_content.innerHTML; 

       ed.selection.getNode().remove(); 
       ed.selection.setContent(stripped_content); 
      } 

      ed.on('NodeChange', function(e) { 
       elem_type = ed.selection.getNode().nodeName; 

       if(elem_type == 'SPAN' && selected_elem.find("span").hasClass("remark-text")) { 
        state = true; 
        ed.controlManager.setActive('remark', state); 
       } 
       else { 
        state = false; 
        ed.controlManager.setActive('remark', state); 
       } 
      }); 
     } 
    });

所以我有一個addButton，它創建我的按鈕。然後，函數的onClick我需要得到選擇的節點using-

ed.focus(); 
ed.controlManager.setActive('remark', state); 
var text = ed.selection.getContent({format : 'text'}); 
var selected_elem = ed.selection.getNode();

我希望它能幫助

來源

2017-04-19 12:56:25

現成的功能。謝謝你們help.I只想檢測用戶的輸入。而當我第一次選擇文本模式，檢測不起作用..但是當我第一次選擇視覺模式，然後切換文本模式的檢測工作 – Cristi

如何在文本模式的tinymce中添加事件監聽器

回答

相關問題