jQuery javascript onclick SlideDown面板

Question

这是bootsnipp上的代码： http ://bootsnipp.com/user/snippets/2pvGr

我正在尝试将导航栏的元素与面板链接。 我希望具有以下功能：

单击导航栏上标识为“ xxx”的元素时，标识为“ yyy”的面板将被收起（slideDown（））

我不知何故..

（＃osPartner-navbar）是导航栏中下拉菜单上按钮的ID。

您可以检查更新的JavaScript ...

有人知道，如何完成这项工作？

PS：另一个小细节。我希望面板的初始位置是“向上滑动”的。 因此，当我单击父面板并将其向下滑动时，两个子面板均向上滑动（关闭），用户必须单击它们才能向下滑动。 如果有人也有解决方案，那么最好加上它。

Answer 1

更换

var $this = (document).getElementById('osPartnerUebersicht');

同

var $this = $('#osPartnerUebersicht');

hasClass是一个jQuery函数，因此您需要jQuery对象。

getElementById将返回dom元素。

Answer 2

不知道这是否有帮助，但是您的JS出现了一些我发现的错误，但是您没有提供任何人都可以正常使用的完整html，但是请看一下：

新：

instead of using $(document).on use $("#osPartner").on("click", func..)

$("#osPartner").on("click",  function(){
    var $this = $("#osPartnerUebersicht"); // Changed like BenG stated before I posted this.
    console.log($this);
    console.log($this.children[0]); 
    console.log($this.children[1]);

    if ($this.hasClass("panel-primary")) {
        console.log("I do!");
    }
});

这是JSFiddle链接： https ://jsfiddle.net/o8yqpefv/

Answer 3

 document.getElementById('contents'); //returns a HTML DOM Object

 var contents = $('#contents');  //returns a jQuery Object

在jQuery中，要获得与document.getElementById相同的结果，可以访问jQuery Object并获取该对象中的第一个元素（请记住JavaScript对象的行为类似于关联数组）。

var contents = $('#contents')[0]; //returns a HTML DOM Object

所以你需要在下面使用

var $this = $('#osPartnerUebersicht');