如何在div元素中使用Javascript语法突出显示文本格式？ [英] How format text, in a div element, with syntax highlighting using Javascript?

问题描述

我正在使用代码片断jQuery Syntax Highlighter。
http://steamdev.com/snippet/

首次显示文本时，其语法显示正确。但是，当我改变文本，脚本不起作用。

Javascript：

 < script type =text / javascript> 
 $（document）.ready（function（）{
 $（pre.ruby）。snippet（ruby，{style：neon}）; 
}）
 
 //此函数删除所有#aside子元素，重新创建子元素#code 
 //并更改文本内部#code 
函数loadUrl（url）{
 var node = dojo.byId（aside）; 
 
 
 while（node.hasChildNodes（））{
 node.removeChild（node.lastChild）; 
} 
 
 var aside = document.getElementById（'aside'）; 
 aside.innerHTML =< pre id ='code'class ='ruby'>< / pre>; 
 
 
 $（＃code）。load（url）; 
 $（pre.ruby）。snippet（ruby，{style：neon}）; 
 
} 
< / script> 
  

HTML：

 < div id =aside> 
< pre id =codeclass =ruby> 
< / pre> 
< / div> 
  

解决方案

load code>在第二次应用语法突出显示之前未完成。您应该将语法调用移动到 load（）的完成回调。



  $（＃code）。load（url，function（）{
 $（pre.ruby）。snippet（ruby，{style：neon}）; 
 }）; 
  




i'm using Snippet jQuery Syntax Highlighter. http://steamdev.com/snippet/

When the text is first displayed, its syntax appears correctly. But when I change the text, the script does not work.

Javascript:

<script type="text/javascript">
  $(document).ready(function(){
    $("pre.ruby").snippet("ruby",{style:"neon"});
  })

  //This function remove all #aside child elements, recreate child #code
  //And change text inner #code
  function loadUrl(url) {
var node = dojo.byId("aside");


while (node.hasChildNodes()) {
      node.removeChild(node.lastChild);
}

var aside = document.getElementById('aside');
aside.innerHTML = "<pre id='code' class='ruby'> </pre>";


$("#code").load(url);
$("pre.ruby").snippet("ruby",{style:"neon"});

   }
 </script>

HTML:

<div id="aside">
  <pre id="code" class="ruby">
  </pre>
</div>

解决方案

load() isn't completing before you apply syntax highlighting the second time. You should move the syntax call to load()'s completion callback.

$("#code").load(url, function() {
    $("pre.ruby").snippet("ruby",{style:"neon"});
});

这篇关于如何在div元素中使用Javascript语法突出显示文本格式？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！