TinyMCE Text hightlight mit regulärem Ausdruck

Question

Nur eine Frage zum regulären Ausdruck hier, im Grunde müssen wir eine Option für die Menschen, um einen Teil des Textes, der mit einem Knopf auf Flash-Front-End, und wann ausgeblendet werden, geben jemand wird auf klicken MEHR es wird es erweitern. hier ist ein Beispieltext in tinyMCE

some text <start> some inner test </end> 

hier so ist der reguläre Ausdruck diesen Start- und Zieltext zu fangen,

<start>(((?!<(?:\/end|start)>).)+)<\/end> 

der obige Ausdruck verwendet wird, wird diese einen inneren TEST abzuzustreifen und wir konvertieren dies zu FLASH freundlich MEHR Taste.

Meine Frage ist: Gibt es eine Möglichkeit, den Text nach innen beginnen & Endtags on the fly zu markieren (während der Bearbeitung), damit die Leute wissen, welcher Teil für MORE-Taste versteckt werden

Answer 1

Okay Leute meine Schulter klopfen auf dies: D Wenn Sie nicht wissen, was der Code unten ist, dann lernen Sie die Grundlagen der TinyMCE Initialisierung. Ich habe dies in der jQuery-Version getan.

Hier ist meine Lösung

var highlighter = 1; // A global variable, just to create a toggle for show/hide highlight 

hinzugefügt drei-Buttons

theme_advanced_buttons1: 'startmore, highlight, endmore, ...'; 

setup: Code zu initialisieren hinzufügen.

// start highlight, end highlight and show highlight buttons 

setup: function(ed) { 
    ed.addButton('startmore', { 
     title: 'Start More', 
     image: 'images/end_s.png', 
     onclick: function() { 
      ed.selection.setContent('[start]'); 
     } 
    }); 
    ed.addButton('endmore', { 
     title: 'End More', 
     image: 'images/end_m.png', 
     onclick: function() { 
      ed.selection.setContent('[end]'); 
      if (1 == highlighter) { 
       highlight_tags(); 
      } 
     } 
    }); 
    ed.onInit.add(function(ed) { 
     highlight_tags(); 
    }); 
    ed.onSubmit.add(function(ed, e) { 
     var html_output = highlight_remove(tinyMCE.activeEditor.getContent()); 
     tinyMCE.activeEditor.setContent(html_output); 
    }); 

    ed.addButton('highlight', { 
     title: 'Show collapse selection', 
     image: 'images/end_highlight.png', 
     onclick: function() { 
      if (1 == highlighter) { 
       var html_output = highlight_remove(tinyMCE.activeEditor.getContent()); 
       tinyMCE.activeEditor.setContent(html_output); 
       highlighter = 0; 
      } else { 
       highlight_tags(); 
       highlighter = 1; 
      } 
     } 
    }); 
    ed.onContextMenu.add(function(ed, e) { 
     tinymce.dom.Event.cancel(e); 
     if (1 == highlighter) { 
      highlight_tags(); 
     } 
    }); 
} 

onContextMenu wird verwendet, um die Markierung mit der rechten Maustaste in den Editor anzuzeigen/zu beheben. Es gibt ein Problem zu zeigen Highlight auf sie fliegen, so bald ich setSontent() es bewegt den Cursor am Anfang der ersten Zeile.

Im Folgenden sind die Funktionen für reguläre Ausdrücke beschrieben, bei denen die Hervorhebung um die Tags [start] [end] herum angeordnet wird.

function highlight_tags() { 
    var html_output = tinyMCE.activeEditor.getContent(); 
    html_output = highlight_remove(html_output); 
    var regex = new RegExp(/\[start\](((?!\[(?:end|start)\]).)+)\[end\]/ig); 

    html_output = html_output.replace(regex,'<span style="background-color:> yellow;">[start]$1[end]</span>'); 
    tinyMCE.activeEditor.setContent(html_output); 
} 

function highlight_remove(html_output) {   
    var regex_fix = new RegExp(/<span\sstyle="background-color:\syellow;">(.+?)<\/span>/ig); 
    return html_output.replace(regex_fix,'$1'); 
} 

Hmm so weit es dient mir.

Nur onSubmit Ich versuche, das Highlight zu entfernen, damit es nicht in die Datenbank gehen und für eine Sekunde kann ich sehen, dass Highlight entfernt wird. Aber es geht in Datenbank ... also das jetzt zu beheben.

Lassen Sie mich wissen, wenn Sie keinen Teil verstehen.

HINWEIS: Wenn es einen Tippfehler im Code gibt, könnte dieser Stapelüberlaufeditor sein :). HINWEIS: Ich weiß, dass dieser Code kann viel verbessert werden, so bitte mich aufklären.