@yischyk

Как сделать, чтобы при нажатии открывался контент?

<head>  
<meta http-equiv="Content-Type" content="text/html; Charset=UTF-8">  
<script type="text/javascript" src="jquery.js"></script>  
</head>  
  
<body>  
      
    <p>Какую страницу желаете открыть?</p>  
    <form>  
        <input id="btn1" type="button" value="Страница 1">   
        <input id="btn2" type="button" value="Страница 2">  
    </form>  
    <div id="content"></div>  
      
    <script>  
        $(document).ready(function(){  
          
            $('#btn1').click(function(){  
                $.ajax({  
                    url: "geography.php",  
                    cache: true,  
                    success: function(html){  
                        $("#content").html(html);  
                    }  
                });  
            });  
              
            $('#btn2').click(function(){  
                $.ajax({  
                    url: "page2.php",  
                    cache: false,  
                    success: function(html){  
                        $("#content").html(html);  
                    }  
                });  
            });  
              
        });  
    </script>


есть такой код. Демо a0316623.xsph.ru/test.php

при нажатии на кнопку подгружается контент без перезагрузки сторы.

но перезагружается он только после второго нажати кнопки , почему?

(у меня там диаграммы от chartist)
  • Вопрос задан
  • 73 просмотра
Решения вопроса 1
ivan_zhuck
@ivan_zhuck
но перезагружается он только после второго нажати кнопки

На самом деле, контент загружается успешно при первом нажатии на кнопку, но при рендере вываливается ошибка в JS:
5d20ac7f752c3633414623.png
Все из-за того, что ты возвращаешь ответ на AJAX-запрос, который мало того, что представляет собой исполняемый код (что само по себе не безопасно), так еще и содержит в себе ссылку на внешнюю JS-библиотеку, которая естественно не успевает загрузиться вовремя и все валится.

Правильно держать реализацию функций приложения в основных скриптах загружаемых вместе со страницей, а с сервера через AJAX возвращать только данные, например в JSON.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы