Загрузка страниц без изображений с помощью ajax-запроса в .NET Core 2.0 - PullRequest
Новая
       32

Загрузка страниц без изображений с помощью ajax-запроса в .NET Core 2.0

0 голосов
/ 11 февраля 2019

Я преобразовал HTML-страницы в приложение ASP.NET CORE 2.1 MVC и загружаю страницы с помощью запроса ajax.Когда выполняется запрос ajax, страницы загружаются, но без изображений.Пожалуйста, посмотрите на мой код и помогите мне решить эту проблему.

С наилучшими пожеланиями

Я создал общий макет (основной макет) с именем _PublicLayout.cshtml.В теге body я отображаю страницы.И в конце тега body у меня есть код JQuery AJAX, который запрашивает другие страницы.Страницы успешно загружены, но без изображений. 

 </p>

<pre><code>@{
    Layout= "_Layout.cshtml";
}
<html>
    <head>
    </head>

    <body>

  <main id="content" role="main">
@RenderBody()
@await Html.PartialAsync("_Footer")
  </main>



<script>
var BASE_URL = "https://localhost:5001"; 

  $('.link').click(function(){
    var href= $(this).attr('href');
    var url = BASE_URL+href;

$.get(url,function(page){
  $('#content').load(page); 
  $(document).scrollTop();
  $('#content').css('top', screenTop);
});

    return false;
  });
</script>
    </body>
</html>

Вот страница, которую необходимо загрузить с изображениями по запросу AJAX. 

 </p>

<pre><code>@{
    Layout = "_PublicLayout";
    ViewData["Title"] = "About";
}

    <!-- Item -->
        <div class="cbp-item">
          <div class="cbp-caption">
            <a class="cbp-lightbox u-media-viewer" href="/img/1920x1920/img1.jpg" data-title="Front in frames - image #01">
              <img class="img-fluid rounded" src="/img/500x805/img1.jpg" alt="Image Description">
              <span class="u-media-viewer__container">
                <span class="u-media-viewer__icon">
                  <span class="fas fa-plus u-media-viewer__icon-inner"></span>
                </span>
              </span>
            </a>
          </div>
        </div>
        <!-- End Item -->

        <!-- Item -->
        <div class="cbp-item">
          <div class="cbp-caption">
            <a class="cbp-lightbox u-media-viewer" href="/img/1920x1080/img27.jpg" data-title="Front in frames - image #02">
              <img class="img-fluid rounded" src="/img/380x227/img1.jpg" alt="Image Description">
              <span class="u-media-viewer__container">
                <span class="u-media-viewer__icon">
                  <span class="fas fa-plus u-media-viewer__icon-inner"></span>
                </span>
              </span>
            </a>
          </div>
        </div>
        <!-- End Item -->

        <!-- Item -->
        <div class="cbp-item">
          <div class="cbp-caption">
            <a class="cbp-lightbox u-media-viewer" href="/img/1920x1920/img16.jpg" data-title="Front in frames - image #03">
              <img class="img-fluid rounded" src="/img/380x360/img23.jpg" alt="Image Description">
              <span class="u-media-viewer__container">
                <span class="u-media-viewer__icon">
                  <span class="fas fa-plus u-media-viewer__icon-inner"></span>
                </span>
              </span>
            </a>
          </div>
        </div>
        <!-- End Item -->

        <!-- Item -->
        <div class="cbp-item">
          <div class="cbp-caption">
            <a class="cbp-lightbox u-media-viewer" href="/img/1920x1080/img4.jpg" data-title="Front in frames - image #04">
              <img class="img-fluid rounded" src="/img/380x227/img2.jpg" alt="Image Description">
              <span class="u-media-viewer__container">
                <span class="u-media-viewer__icon">
                  <span class="fas fa-plus u-media-viewer__icon-inner"></span>
                </span>
              </span>
            </a>
          </div>
        </div>
        <!-- End Item -->

        <!-- Item -->
        <div class="cbp-item">
          <div class="cbp-caption">
            <a class="cbp-lightbox u-media-viewer" href="/img/1920x1080/img25.jpg" data-title="Front in frames - image #05">
              <img class="img-fluid rounded" src="/img/380x360/img24.jpg" alt="Image Description">
              <span class="u-media-viewer__container">
                <span class="u-media-viewer__icon">
                  <span class="fas fa-plus u-media-viewer__icon-inner"></span>
                </span>
              </span>
            </a>
          </div>
        </div>
        <!-- End Item -->

        <!-- Item -->
        <div class="cbp-item">
          <div class="cbp-caption">
            <a class="cbp-lightbox u-media-viewer" href="/img/1920x1080/img21.jpg" data-title="Front in frames - image #06">
              <img class="img-fluid rounded" src="/img/380x360/img22.jpg" alt="Image Description">
              <span class="u-media-viewer__container">
                <span class="u-media-viewer__icon">
                  <span class="fas fa-plus u-media-viewer__icon-inner"></span>
                </span>
              </span>
            </a>
          </div>
        </div>
        <!-- End Item -->

        <!-- Item -->
        <div class="cbp-item">
          <div class="cbp-caption">
            <a class="cbp-lightbox u-media-viewer" href="/img/1920x1080/img26.jpg" data-title="Front in frames - image #07">
              <img class="img-fluid rounded" src="/img/380x227/img3.jpg" alt="Image Description">
              <span class="u-media-viewer__container">
                <span class="u-media-viewer__icon">
                  <span class="fas fa-plus u-media-viewer__icon-inner"></span>
                </span>
              </span>
            </a>
          </div>
        </div>
        <!-- End Item -->
      </div>
      <!-- End Content -->
    </div>
    <!-- End Frames Section -->

ПРИМЕЧАНИЕ:
Страница с изображениями прекрасно загружается при прямых запросах.Но проблема возникает в запросах.

...