当前位置： 移动技术网 > IT编程>开发语言>JavaScript > z-blog SyntaxHighlighter 长代码无法换行解决办法(jquery)

z-blog SyntaxHighlighter 长代码无法换行解决办法(jquery)

2019年04月06日  | 移动技术网IT编程  | 我要评论

z-blog syntaxhighlighter 长代码无法换行解决办法(jquery)。

1、css修改：

\

在文件夹：\zb_system\admin\ueditor\third-party\syntaxhighlighter

在文件shcoredefault.pack.css添加css：

 

代码如下:


body .syntaxhighlighter .line{     white-space: pre-wrap !important;} .syntaxhighlighter{width:100%!important;margin:.3em 0 .3em 0!important;position:relative!important;overflow:auto!important;background-color:#f5f5f5!important;border:1px solid #ccc!important;word-break:break-all;

 

2、jquery代码：

$(function () { 
  // line wrap back 
  var shlinewrap = function () { 
    $('.syntaxhighlighter').each(function () { 
      // fetch 
      var $sh = $(this), 
        $gutter = $sh.find('td.gutter'), 
        $code = $sh.find('td.code') 
        ; 
      // cycle through lines 
      $gutter.children('.line').each(function (i) { 
        // fetch 
        var $gutterline = $(this), 
          $codeline = $code.find('.line:nth-child(' + (i + 1) + ')') 
          ; 
        //alert($gutterline); 
        // fetch height 
        var height = $codeline.height() || 0; 
        if (!height) { 
          height = 'auto'; 
        } 
        else { 
          height = height += 'px'; 
          //alert(height); 
        } 
        // copy height over 
        $gutterline.attr('<span style="width: auto; height: auto; float: none" id=0_nwp><a style="text-decoration: none" id=0_nwl href="https:///cpro/ui/uijs.php?rs=1&u=http%3a%2f%2fwww%2esuchso%2ecom%2fprojecteactual%2fz%2dblog%2djquery%2dsyntaxhighlighter%2dlongcode%2ehtml&p=baidu&c=news&n=10&t=tpclicked3_hc&q=95053049_cpr&k=style&k0=%ce%c4%bc%fe%bc%d0&kdi0=32&k1=style&kdi1=1&k2=%b2%a9%bf%cd&kdi2=1&sid=77860fedb9413425&ch=0&tu=u1702844&jk=e7459084404b7b2f&cf=29&fv=15&stid=9&urlid=0&luki=2&seller_id=1&di=128" target=_blank mpid="0"><span style="width: auto; float: none; height: auto; color: #0000ff; font-size: 16px">style</span></a></span>', 'height: ' + height + ' !important'); // fix by edi, for jquery 1.7+ under firefox 15.0 
        console.debug($gutterline.height(), height, $gutterline.text(), $codeline); 
      }); 
    }); 
  }; 
  // line wrap back when syntax highlighter has done it's stuff 
  var shlinewrapwhenready = function () { 
    if ($('.syntaxhighlighter').length === 0) { 
      settimeout(shlinewrapwhenready, 10); 
    } 
    else { 
      shlinewrap(); 
    } 
  }; 
  // fire 
  shlinewrapwhenready();});

上面的代码就是属于长代码。大家看看是不是都换行了？？

现在，行号的高度就能和代码的高度保持一致了。

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网