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>

现在这是我的页面getresult：

<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>

我的问题是旋转木马课程没有用。当我删除课程owl-carousel时，我可以看到图片。我的index.php中有CSS和JS owl-carousel。当我在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

1 个答案: