Показать сообщение отдельно
  #6 (permalink)  
Старый 16.11.2017, 15:06
Профессор
Отправить личное сообщение для Dilettante_Pro Посмотреть профиль Найти все сообщения от Dilettante_Pro
 
Регистрация: 27.11.2015
Сообщений: 2,899

daslex,
3.html - самостоятельная страница, со своими плагинам, скриптами, стилями и не будет нормально работать в div.

Не хотите грузить в iframe - тогда надо именно в нее добавлять элементы управления, а блоки pre помещать в скрываемые/отображаемые div или использовать
<pre class='brush: js; collapse: true'>Здесь контент, который необходимо подсветить и скрыть</pre>


Например, вот такой гибридный вариант
<head>
<meta charset="UTF-8">
	<link rel="stylesheet" href="syntaxhighlighter/styles/shCore.css" type="text/css">
	<link rel="stylesheet" href="syntaxhighlighter/styles/shThemeDefault.css" type="text/css">
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
    <script>
    $(document).ready(function () {
        $('input[name=sw]').click(function () {
            var v = ($(this).val());
            console.log(v);
            if (v === 'one') {
                $('#one').show();
                $('#two').hide();
                $('#three').hide();
            }
            else if (v === 'two') {
                $('#one').hide();
                $('#two').show();
                $('#three').hide();
            }
            else if (v === 'three') {
                $('#one').hide();
                $('#two').hide();
                $('#three').show();
                //=============
                /*$.ajax({  
                url: "2.html",  
                cache: false,  
                success: function(html){  
                $("#three").html(html);  
                }  
                });  	
                */

                $(document).ready(function () {
                    $("#three").attr("src", "3.html");
                });

                //=============
            }
        })
    })
    </script>
 </head>
 <body>
<input type="radio" name="sw" value="one" id="x1"><label for="x1">1</label>
<input type="radio" name="sw" value="two" id="x2"><label for="x2">2</label>
<input type="radio" name="sw" value="three" id="x3"><label for="x3">3</label>

<div id="one"  style="display:none">
  <pre class="brush: html">                                    
	  <div class="wraperr1">
	      <div class="lefmenu">Hello world </div>
	      <div class="content"> </div>
	  </div>
  </pre>
</div>
<div id="two"  style="display:none">
  <pre class="brush: html">                                    
	  <div class="wraperr2">
	      <div class="lefmenu">Hello world </div>
	      <div class="content"> </div>
	  </div>
  </pre>
</div> 
<div id="three"  style="display:none">
  <pre class="brush: html">                                    
	  <div class="wraperr3">
	      <div class="lefmenu">Hello world </div>
	      <div class="content"> </div>
	  </div>
  </pre>
</div>  
<pre class='brush: html; collapse: true'>
	  <div class="wraperr4">
	      <div class="lefmenu">Hello world </div>
	      <div class="content"> </div>
	  </div>
</pre>

 <script  type="text/javascript" src="syntaxhighlighter/scripts/shCore.js"></script>
	<script  type="text/javascript" src="syntaxhighlighter/scripts/shBrushCss.js"></script>
	<script  type="text/javascript" src="syntaxhighlighter/scripts/shBrushXml.js"></script>
	<script  type="text/javascript" src="syntaxhighlighter/scripts/shBrushJScript.js"></script>
	
	<script  type="text/javascript">
	       SyntaxHighlighter.all()
	</script>
</body>

Последний раз редактировалось Dilettante_Pro, 16.11.2017 в 15:33.
Ответить с цитированием