【问题标题】:JQuery SyntaxHighLighter Plugin in tinyMCE iframetinyMCE iframe 中的 JQuery SyntaxHighLighter 插件
【发布时间】:2013-05-23 17:05:43
【问题描述】:

我发现了一个关于 SyntaxHighlighter 的问题。

但是,我说的是 jquery 插件而不是 https://github.com/RichGuk/syntaxhl

我想在 tinyMCE 中突出显示源代码 我添加以下按钮:

ed.addButton('srccd', {
                     title: 'Source Code',
                     image: 'sourcecode.png',
                     onclick: function() {
                         ed.focus();       
                         var newSRCjq='<pre id="s1" class="highlight">'+ ed.selection.getContent() + '</pre>';
                         ed.selection.setContent(newSRCjq);


                           $.SyntaxHighlighter.init({})

                     }
                 });

我还使用另一个插件(sn-p),而不是 init invoke ,我调用以下函数:

 $('iframe').contents().find('#s1').snippet("java",{style:'kwrite',box:"1"});

我没有达到预期的结果。

注意:我不会忘记为上面的插件导入所需的 JS 和 CSS

【问题讨论】:

    标签: jquery-plugins tinymce syntaxhighlighter


    【解决方案1】:

    一天后: 下面介绍一下我的 JQuery Compiler,它是一个基于 jQuery Syntax Highlighter v2.0.0的编译器:

    如何使用

    而不是:

    $('pre').snippet('java',{box:"1-2"});
    

    添加本地或会话参数:

    $('pre').snippetcache('local','java',{box:"1-2"});
    

    ==>这意味着你有 pre 元素。当你运行上面的 sn -p 时,我的插件会使用 jQuery Syntax Highlighter 编译代码,然后保存渲染的代码。因此,如果另一个 pre 具有相同的代码(内部文本),例如以前的 pre 已编译,编译器将从其缓存中检索呈现的代码。

    但是,当你刷新页面时,缓存会被移除。如果你想有一个有状态的编译器,使用会话参数值而不是本地的

    $('pre').snippetcache('session','java',{box:"1-2"});
    

    demo

    这个插件在 iframe 中作为 tinyMCE 非常有用。事实上,试试这个:

        ed.addButton('srccd', {
                             title: 'Source Code',
                             image: 'sourcecode.png',
                             onclick: function() {
                                 ed.focus();   
                                    //You should have an ID which is generated automatically     
                                 var newSRCjq='<pre id="s1" class="highlight">'+ ed.selection.getContent() + '</pre>';
                                 ed.selection.setContent(newSRCjq);
    
                           // iframe selected is the frame of TinyMCE  
    
                       $('iframe').contents.find('pre#s1').snippetcache('local','java',{box:"1-2"});
    
    
    
    
                     }
                 });
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2015-07-27
      • 1970-01-01
      相关资源
      最近更新 更多