Javascript 让slideToggle（）直接在其上方而不是下方显示内容？_Javascript_Jquery

Javascript 让slideToggle（）直接在其上方而不是下方显示内容？

javascript jquery

Javascript 让slideToggle（）直接在其上方而不是下方显示内容？,javascript,jquery,Javascript,Jquery,问题摘要：与代码当前通常做的事情不同——显示按钮下方的内容——我需要它显示按钮上方的内容。首先，我在任何意义上都不精通jQuery/Javascript，所以如果我要求为我做太多的事情，那么请说出来并提示解决方案现在，谈谈问题： $('.drop_down_title').click(function() { $(this).next('.toggle_panel').slideToggle('slow', function () { }); $(this).find(

问题摘要：与代码当前通常做的事情不同——显示按钮下方的内容——我需要它显示按钮上方的内容。

首先，我在任何意义上都不精通jQuery/Javascript，所以如果我要求为我做太多的事情，那么请说出来并提示解决方案

现在，谈谈问题：

$('.drop_down_title').click(function() {
     $(this).next('.toggle_panel').slideToggle('slow', function () { });
     $(this).find('.arrow_drop_down').toggleClass('selected', function () { });
});

上面的代码非常适合在标题下显示内容（比如在侧边栏中有各种“相关”的块，可以隐藏/显示）

但是，我也计划使用相同的机制来隐藏按钮上方的部分内容，如下所示：

点击按钮以显示更多摘要或要点

我尝试过调整代码，使其符合逻辑，如：

$(this).previous('.toggle_panel')

希望它在页面上查找相关类，但仍然没有骰子

谢谢你的时间；如有任何建议、帮助或解决方案，将不胜感激

请求的HTML（对于当前工作幻灯片向下）：


按钮点击
这是当点击上面的按钮时应该隐藏的一些示例内容

我正在尝试获取它，以便切换div的“下拉标题”和“切换面板”。因此，内容将显示在按钮上方。

也许.prev（）是您实际需要的。不是，以前的。请参见

能否显示一些html？如果您完全基于元素的底部定位元素，则slideToggle将设置元素高度的动画，因此它将设置自上而下而不是自下而上的动画。不过，我怀疑你真的需要这么做。我们需要看一些html/css@Tetaxa添加了HTML，希望对大家有所帮助@KevinB我不能绝对定位元素。我需要它们是正常流程中的块。我不确定CSS会有什么帮助。没有css栏的标准样式已经需要让下拉一个工作，因此没有什么真正的帖子。把HTML放进去了，所以。。。单击“更多”时，按钮上方的内容部分是否需要增加高度？如果是这样的话，在html示例中显示两个部分是有意义的，因为现在我们必须针对一个您没有显示的理论元素。在任何一种情况下，

.nestest（selector）.prev（）.find（selector）

的某些组合都应该满足您的需要。尝试简单地将prev替换为不起作用的prev。老实说，我认为这可能是因为我对Javascript和jQuery缺乏理解。我无法想象在按钮上方而不是按钮下方显示内容会被听到。同时，我将开始阅读它们的基础知识，谢谢你的建议和链接。为什么你不能定位。切换上面的面板。下拉标题并使用.prev（）？如果确实需要移动div，那么可以使用

$（this）.next（）.insertBefore（$（this））.slideToggle（'slow'，function（）{}）啊哈！我在写这篇文章的时候看到了你的评论，还有这个问题！问题出在我的理解/知识上，我阅读了文档，意识到它不是用来定位选择器的，而是以前的兄弟姐妹（你说得对，对我来说太完美了！）。所以我所要做的就是移除选择器（给我留下prev（）），等等，瞧，它成功了！非常感谢你！
<html>

<div class="slidebox">

    <div class="drop_down_title">
        <a class="arrow_drop_down">Button Click</a>
    </div>

    <div class="toggle_panel">
        <p>This is some example content that should be hidden when the above button is clicked!</p>
    </div>

</div>
</html>