Подсветка синтаксиса вокруг элемента Div - PullRequest
Новая
       0

Подсветка синтаксиса вокруг элемента Div

0 голосов
/ 01 сентября 2010

Я использую плагин подсветки синтаксиса и хочу всегда применять его к определенной области div.Содержимое div будет меняться в зависимости от гиперссылки при нажатии.Как я могу всегда включать тег сценария подсветки синтаксиса вокруг элемента "mydiv"? 

<script>
    function viewCode() {
        $('#mydiv').load('euler/_48.py');   
    }
</script>

<a href="#" onClick="viewCode();return true">View Code</a>

<div id="mydiv">
    my div's initial content
</div>

<script type="syntaxhighlighter" class="brush: js"><![CDATA[
    //always apply this script to mydiv
]]></script>

Ответы [ 2 ]

3 голосов
/ 01 сентября 2010

С помощью syntaxHighlighter вы не можете выделять произвольные элементы на странице, поэтому вместо этого мы будем придерживаться метода script.

Сначала присвойте сценарию и тегу привязки id, например 

<a href="#" id="show_code">Show Code</a>
<script type="syntaxhighlighter" class="brush: js" id="highlighted"></script>

Затем используйте это для загрузки содержимого, когда пользователь нажимает на ссылку 

$('#show_code').click(function(){
  $.get('euler/_48.py', function(data){
    $('#highlighted').html('<![CDATA[' + data + ']]>');
    SyntaxHighligher.highlight();
  });
});

Помните, что обычный метод использования syntexhighlighter.js не будет работать здесь, потому что функция SyntaxHighlighter.all() только связывает функцию highlight() с событием onload, поэтому вам придется вызывать эту функцию каждый раз, когда страницаобновлений, добавляя вызов к функции SyntaxHighligher.highlight() каждый раз, когда вы обновляете страницу.

В качестве альтернативы я бы обычно рекомендовал метод pre.Это почти то же самое, что и выше, но вместо этого мы используем элемент pre и используем функцию text() jQuery для правильного выполнения экранирования.Использование элемента pre: 

<code><pre class="brush: js" id="highlighted">

С этим фрагментом Javascript 

$.get('euler/_48.py', function(data){
  $('#highlighted').text(data);
  SyntaxHighligher.highlight();
});
0 голосов
/ 01 сентября 2010

Я думаю, вы можете вызвать метод HighlightAll

Пример: dp.SyntaxHighlighter.HighlightAll('code');

Sultan

...