1

我试图允许用户使用 idiot/unslider 插件浏览帖子，所以我希望能够动态加载帖子。

这是我到目前为止得到的：

查看/显示

<div class="banner">
<ul id="thelist">
    <li><%= render 'showpost' %></li>
</ul>
</div>
<script type="text/javascript">
$(function() {
$('.banner').unslider();
});

</script>

<script type="text/javascript">
var unslider = $('.banner').unslider();

$('.unslider-arrow').click(function() {
    var fn = this.className.split(' ')[1];     
    //  Either do unslider.data('unslider').next() or .prev() depending on the className
    unslider.data('unslider')[fn]();
});
</script>

<script type="text/javascript">
$(document).ready(function(){
$("#thelist").append($("<li> '<%=j render 'showpost' %>' </li>")
})
</script>

查看/_showpost

<div class="showpartial">
<h4 clas="title">
<%= @post.title %>
</h4>
<br>
<div class="row">
<div class="simplepost">
<div class="col-md-4 col-md-offset-2">
  <div class="content">
    <p ><%= simple_format(@post.chinese) %></p>
  </div>
</div>
<div class="col-md-6">
  <div class="translation">
  <p>
      <%= simple_format(@post.english) %>
  </p>
</div>
</div>
</div>
</div>

<% @previous = @posts.where(chapter: @post.chapter - 1).first %>
<%= link_to 'Previous', @next, {class: "unslider-arrow prev"} %>

<% @next = @posts.where(chapter: @post.chapter + 1).first %>
<%= link_to 'Next', @next, {class: "unslider-arrow next"} %>





<% if admin? %>
<%= link_to 'Edit', edit_post_path(@post) %> |
<% end %>
<%= link_to 'Back', posts_path %>

</div>

基本上我想做的是在加载当前帖子后将下一个帖子附加到滑块，以便用户可以有一个很好的滑动过渡。我找不到太多关于这种转换的文档，而且我对 JQuery 还是很陌生，所以非常感谢任何帮助！

谢谢

4

0 回答 0