Syntaxe surligneur autour d'une Div Élément

Question

J'utilise le plugin surligneur de syntaxe et je veux avoir toujours appliqué à une zone div spécifique. Le contenu de la div va changer en fonction d'un lien hypertexte sur le clic. Comment puis-je joindre la balise de script de surligneur de syntaxe autour de l'élément "mydiv" à tout moment?

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

Answer 1

Avec SyntaxHighlighter, vous ne pouvez pas mettre en évidence des éléments arbitraires sur la page, donc nous en tenir à la méthode script à la place.

D'abord, donner la balise de script et ancre une id, comme

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

Ensuite, utilisez cette option pour charger le contenu lorsque l'utilisateur clique sur le lien

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

Rappelez-vous que la méthode habituelle d'utiliser syntexhighlighter.js ne fonctionnerait pas ici parce que la fonction SyntaxHighlighter.all() ne lie que la fonction highlight() à l'événement onload, vous devrez appeler cette fonction vous-même chaque fois que la page updat es, en ajoutant un appel à la fonction SyntaxHighligher.highlight() chaque fois que vous mettez à jour la page.

---

Sinon, je vous recommande généralement la méthode pre. Son presque la même chose que ci-dessus, mais nous utilisons l'élément pre à la place et utiliser la fonction jQuery text() pour obtenir l'échappement fait correctement. En utilisant l'élément pre:

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

Avec ce morceau de Javascript

$.get('euler/_48.py', function(data){ 
    $('#highlighted').text(data); 
    SyntaxHighligher.highlight(); 
}); 

Answer 2

Je pense que vous pouvez appeler la méthode HighlightAll

Exemple: dp.SyntaxHighlighter.HighlightAll('code');

Sultan