Javascript Jquery slideDown（）无法正常工作

我有一张有三个部分的表格。在表单的开头，使用css隐藏后两个部分。一旦用户按下第一部分中的“下一步”按钮，第二部分应向下滑动到视图中，但当前要向下滑动的动画开始，然后立即重置。有人知道这个问题吗

Jquery脚本：

<script> 
        $(document).ready(function(){
            $("#buttonToSecondaryDetailsSection").click(function(){
                $("#secondaryDetailsForm").slideDown("slow");
            });

            $("#buttonToCommentsSection").click(function(){
                $("#commentsDetailsForm").slideDown("slow");
            });
        });
</script>

编辑：我以前尝试过使用.show（）而不是slideDown（），该部分在再次消失之前会闪烁

---

编辑2:e.preventDefault（）；成功了。对于这个混乱的问题，我很抱歉，我试图获得一个使用JSFIDLE的示例，但它在左右和中间抛出了错误。

这可能是您问题的解决方案。考虑到您的描述，我认为您的按钮所做的比它们应该做的更多，而实际发生的是页面正在刷新到原始状态。你能试试这个吗

    $(document).ready(function(){
        $("#buttonToSecondaryDetailsSection").click(function(e){
            e.preventDefault();
            $("#secondaryDetailsForm").slideDown("slow");
        });

        $("#buttonToCommentsSection").click(function(e){
            e.preventDefault();
            $("#commentsDetailsForm").slideDown("slow");
        });
    });

---

代码的不同之处在于将e作为事件参数，然后使用按钮停止任何其他操作。如果我对问题的描述是实际发生的情况，那么它应该适用于此更改。

这可能是您问题的解决方案。考虑到您的描述，我认为您的按钮所做的比它们应该做的更多，而实际发生的是页面正在刷新到原始状态。你能试试这个吗

    $(document).ready(function(){
        $("#buttonToSecondaryDetailsSection").click(function(e){
            e.preventDefault();
            $("#secondaryDetailsForm").slideDown("slow");
        });

        $("#buttonToCommentsSection").click(function(e){
            e.preventDefault();
            $("#commentsDetailsForm").slideDown("slow");
        });
    });

---

代码的不同之处在于将e作为事件参数，然后使用按钮停止任何其他操作。如果我对问题的描述是实际发生的情况，那么它应该与此更改一起工作。

我猜在您添加到组件的效果之后，它会使用您之前给他的css属性

<script> 
        $(document).ready(function(){
            $("#buttonToSecondaryDetailsSection").click(function(){
                $("#secondaryDetailsForm").slideDown("slow");
                $("#secondaryDetailsForm").css("display","block");
            });

            $("#buttonToCommentsSection").click(function(){
                $("#commentsDetailsForm").slideDown("slow");
                $("#secondaryDetailsForm").css("display","block");
            });
        });
</script>

$（文档）.ready（函数（）{
$（“#按钮到第二个详细信息部分”）。单击（函数（）{
$（“#Secondary Details Form”）。向下滑动（“慢速”）；
$（“#secondaryDetailsForm”）.css（“显示”、“块”）；
});
$（“#按钮注释部分”）。单击（函数（）{
$（“#commentsDetailsForm”）。向下滑动（“慢速”）；
$（“#secondaryDetailsForm”）.css（“显示”、“块”）；
});
});

---

由于缺少您提供的代码，我无法制作JSFIDLE，但请尝试此操作。

我猜在您添加到组件的效果之后，它将使用您之前提供给他的css属性

<script> 
        $(document).ready(function(){
            $("#buttonToSecondaryDetailsSection").click(function(){
                $("#secondaryDetailsForm").slideDown("slow");
                $("#secondaryDetailsForm").css("display","block");
            });

            $("#buttonToCommentsSection").click(function(){
                $("#commentsDetailsForm").slideDown("slow");
                $("#secondaryDetailsForm").css("display","block");
            });
        });
</script>

$（文档）.ready（函数（）{
$（“#按钮到第二个详细信息部分”）。单击（函数（）{
$（“#Secondary Details Form”）。向下滑动（“慢速”）；
$（“#secondaryDetailsForm”）.css（“显示”、“块”）；
});
$（“#按钮注释部分”）。单击（函数（）{
$（“#commentsDetailsForm”）。向下滑动（“慢速”）；
$（“#secondaryDetailsForm”）.css（“显示”、“块”）；
});
});

---

由于缺少您提供的代码，我无法制作JSFIDLE，但请尝试使用此代码。

使用此代码：它在我这边工作，脚本没有任何更改（与您使用的jquery代码相同）。 检查你的HTML。 并尝试使用

e.preventDefault（）如上文“thanpa”所述


#第二个详细信息表单，#评论详细信息表单{
显示：无；
高度：200px；
}
#第一节{
高度：200px；
}
第一节

点击我
第二节

点击我
第三节

$（文档）.ready（函数（）{
$（“#按钮到第二个详细信息部分”）。单击（函数（）{
$（“#Secondary Details Form”）。向下滑动（“慢速”）；
});
$（“#按钮注释部分”）。单击（函数（）{
$（“#commentsDetailsForm”）。向下滑动（“慢速”）；
});
});
使用此代码：它在我这边工作，脚本没有变化（与您使用的jquery代码相同）。
检查你的HTML。
并尝试使用
e.preventDefault（）如上文“thanpa”所述


#第二个详细信息表单，#评论详细信息表单{
显示：无；
高度：200px；
}
#第一节{
高度：200px；
}
第一节

点击我
第二节

点击我
第三节

$（文档）.ready（函数（）{
$（“#按钮到第二个详细信息部分”）。单击（函数（）{
$（“#Secondary Details Form”）。向下滑动（“慢速”）；
});
$（“#按钮注释部分”）。单击（函数（）{
$（“#commentsDetailsForm”）。向下滑动（“慢速”）；
});
});
您能在现场演示中重现您的问题吗？就目前而言，您的问题是不可复制的：在这里，通过您的代码，我看到它是有效的。那么，您有什么版本的jQuery？你能发布更多的代码吗？按钮能做更多的事情吗？按钮是标签吗？他们有href吗？你必须在网上复制你的问题，很明显，一旦你的元素显示出来，其他东西会隐藏你的元素。顺便说一句，提供相关的HTML标记，可能是一些带有处理程序的事件传播，或者你能在现场演示中重现你的问题吗？就目前而言，您的问题是不可复制的：在这里，通过您的代码，我看到它是有效的。那么，您有什么版本的jQuery？你能发布更多的代码吗？按钮能做更多的事情吗？按钮是标签吗？他们有href吗？你必须在网上复制你的问题，很明显，一旦你的元素显示出来，其他东西会隐藏你的元素。顺便说一句，提供相关的HTML标记，可能是一些带有处理程序的事件传播，或者whatelse+1，用于遍历代码；它显示了努力和真诚——这在今天是罕见的+1用于遍历代码；它显示了努力和真诚——这在当今是罕见的