博客园markdown编辑器中的代码折叠与展开效果设置

注意:
博客园设置里申请js权限。作用到侧边栏就可以,其他地方也行。只适配的markdown编辑器,与其他界面美化代码一起使用可能会出现bug。

默认代码是展开的效果

<script type="text/javascript">
        $(document).ready(function () {
            var pres = $("pre");
            for (var i = 0; i < pres.length; i++) {
                $(pres[i]).attr('id', 'pre' + i);
                //这里注释掉
                //$(pres[i]).children('code').hide();
                //这里原来是view code,改为hide code
                $(pres[i]).prepend('<button id="btn'+ i +'" onclick="view_code(\'pre'+ i +'\');">hide code</button>');
            }
        });
        function view_code (id) {
            var btn_text =  document.getElementById(id).children[0].innerText;
            var style;
            var status;
            if(btn_text == 'view code') {
                style = '""';
                status = 'hide code';
            } else {
                style = 'display: none;';
                status = 'view code';
            }
            document.getElementById(id).children[0].innerText = status;
            document.getElementById(id).children[1].style = style;
        }
</script>

默认代码是隐藏的效果

       $(document).ready(function () {
            var pres = $("pre");
            for (var i = 0; i < pres.length; i++) {
                $(pres[i]).attr('id', 'pre' + i);
                //这里注释掉
                $(pres[i]).children('code').hide();
                //这里原来是view code,改为hide code
                $(pres[i]).prepend('<button id="btn'+ i +'" onclick="hide_code(\'pre'+ i +'\');">view code</button>');
            }
        });
        function hide_code (id) {
            var btn_text =  document.getElementById(id).children[0].innerText;
            var style;
            var status;
            if(btn_text == 'hide code') {
                style = 'display: none;';
                status = 'view code';
            } else {
                style = '""';
                status = 'hide code';

            }
            document.getElementById(id).children[0].innerText = status;
            document.getElementById(id).children[1].style = style;
        }
posted @ 2020-10-10 01:12  richard_A  阅读(941)  评论(0)    收藏  举报