首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >切换div显示在ajax请求后不起作用- Javascript / Ajax

切换div显示在ajax请求后不起作用- Javascript / Ajax
EN

Stack Overflow用户
提问于 2014-10-21 17:09:05
回答 1查看 459关注 0票数 1

我有一个jquery切换来显示/隐藏div上的评论部分。然而,我让评论部分分页,由于某种原因,ajax请求正在停止显示/隐藏的工作。有什么想法吗,伙计们?

Jquery代码

代码语言:javascript
复制
    $('.show-all-comments').click(function() {
        $(this).parent().next('.comments-box').slideToggle("fast"); //slide following class called .comments-box
    });

    jQuery(function($) {  //function for pagination.
        $('.post-list').on('click', '#pagination a', function(e){
            e.preventDefault();
            var link = $(this).attr('href');
            console.log(link);
            $('.post-list').fadeOut(200, function(){
                $(this).load(link + ' .post-list', function() {
                    var link = $(this).attr('href');
                    $(this).fadeIn(100);
                });
            });
        })

HTML输出

代码语言:javascript
复制
<div class="large-5 medium-5 small-12 columns">
          <a class="show-all-comments btn-third-priority">See Comments</a>
        </div>
<div class="large-7 medium-7 small-12 columns">
          <p style="padding-top: 10px; margin-bottom: 4px; font-size:0.9em;">One Response to "Post"
</div>

<div class="comments-box">Content</div>

如果我删除分页,显示页面上的所有帖子,这将允许它工作

谢谢,

DIM3NSION

EN

回答 1

Stack Overflow用户

发布于 2014-10-21 18:06:54

我看到一个错误,不确定这是否是您的分页的问题,但可能是,您说

代码语言:javascript
复制
  $('.show-all-comments').click(function() {
            $(this).parent().next('.comments-box').slideToggle("fast"); //slide following class called .comments-box
        });

但这不适用于您所显示的HTML输出。要使其正常工作,您应该更改为

代码语言:javascript
复制
  $('.show-all-comments').click(function() {
            $(this).parent().siblings('.comments-box').slideToggle("fast"); //slide following class called .comments-box
        });

next()函数将选择紧随其后的同级,如果添加了选择器,则仅当它与选择器匹配时才会匹配它。问题是.comments-box不是紧跟在同级之后的,因为在它们之间有一个DIV节点

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/26482929

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档