修复变灰的 .owl-carousel div

Question

我打电话是为了通过 AJAX 获取页面 (getresult.php)。

我索引中的 ID div：

<div id="pagination">
  <input type="hidden" name="rowcount" id="rowcount" />
</div>

我的页脚：

<script>
  getresult("getresult.php");
</script>

页脚调用getresult的脚本：

<script>
  function getresult(url) {
    $.ajax({
      url: url,
      type: "GET",
      data: {
        rowcount: $("#rowcount").val()
      },
      success: function(data) {
        $("#pagination").html(data);
      },
      error: function() {}
    });
  }
</script>

现在这是我的页面结果：

<div class="blog-posts">
  <article class="post post-medium">
    <div class="row">
      <div class="col-md-5">
        <div class="post-image">
          <div class="owl-carousel" data-plugin-options='{"items":1}'>
            <div>
              <div class="img-thumbnail">
                <img class="img-responsive" src="./img/blog/blog-image-2.jpg" alt="">
              </div>
            </div>
            <div>
              <div class="img-thumbnail">
                <img class="img-responsive" src="./img/blog/blog-image-1.jpg" alt="">
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="col-md-7">
        <div class="post-content">
          <h2><a href="blog-post.html">Class aptent taciti sociosqu ad litora torquent</a></h2>
          <p>Euismod atras vulputate iltricies etri elit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nulla nunc dui, tristique in semper vel, congue sed ligula. Nam dolor ligula, faucibus id sodales in, auctor fringilla libero. Pellentesque pellentesque tempor tellus eget hendrerit. Morbi id aliquam ligula. Aliquam id dui sem. Proin rhoncus consequat nisl, eu ornare mauris tincidunt vitae. [...]</p>
        </div>
      </div>
    </div>
  </article>
</div>

我的问题是轮播 class 不工作。当我删除 class owl-carousel 时，我可以看到图片。我的 CSS 和 JS owl-carousel 在我的 index.php 中。当我在 Firebug 中看到 HTML 时，我看到了这一行 <div class="owl-carousel" data-plugin-options='{"items":1}'> 变灰了。

Answer 1

终于找到了。

我忘了把这个放在我的 getresult.php

<script>
    $(document).ready(function() {

      $(".owl-carousel").owlCarousel({

          navigation : false, // Show next and prev buttons
          slideSpeed : 300,
          paginationSpeed : 400,
          singleItem:true

          // "singleItem:true" is a shortcut for:
          // items : 1, 
          // itemsDesktop : false,
          // itemsDesktopSmall : false,
          // itemsTablet: false,
          // itemsMobile : false

      });

    });

    </script>

修复变灰的 .owl-carousel div

Fixing greyed-out .owl-carousel div

javascript

jquery

html

options

owl-carousel