Загрузить HTML-страницу внутри DIV с помощью .загрузка и jQuery

#javascript #jquery #html

#javascript #jquery #HTML

Вопрос:

У меня есть функция в PHP, которая отображает и возвращает HTML-содержимое, и мне нужно загрузить этот результат в DIV при загрузке страницы. Я делаю таким образом:

  <div id="myModal" class="reveal-modal" title="El Farol" data-animation="fade"> <a class="close-reveal-modal">amp;#215;</a>
     <script>
         $(document).ready(function() {
             $(this).load("http://devserver/app_dev.php/register");
         });
     </script>
 </div>
  

Но я ничего не получаю, если я вызываю http://devserver/app_dev.php/register из браузера, я получаю HTML. Что я делаю не так? Как правильно загружать HTML-содержимое в контейнер при полной загрузке DOM или загрузке страницы?

Ответ №1:

Ваш html и JS должны быть разделены следующим образом:

 <div id="myModal" class="reveal-modal" title="El Farol" data-animation="fade">
</div>

 <script>
     $(document).ready(function() {
         $('#myModal').load("/app_dev.php/register", function() {
              $('#myModal').append( '<a class="close-reveal-modal">amp;#215;</a>' );
         });
     });
 </script>
  

Ответ №2:

Попробуйте это:

Я вставил ссылку в a href тег вместо скрипта… Таким образом будет проще заменять ссылки.

HTML:

 <div id="myModal" class="reveal-modal" title="El Farol" data-animation="fade">
<a class="close-reveal-modal" href="http://devserver/app_dev.php/register">Page 1</a>
  

jQuery:

 $(document).ready(function(){
  $('a').click(function(e){
     e.preventDefault();
     $("#myModal").load($(this).attr('href'));
  });
});