锚点上的嵌套ul show单击

斯图·布莱克特(StuBlackett)

我有一个类似这样的网站:

当我单击“ add-info”时,ul不显示,不太确定如何显示它?

<ul>
    <li>Liebherr LHM 600 Mobile Harbour Crane. <a class="add-info" href="#">Find out more</a>
        <ul class="hidden-list">
            <li>Liebherr LHM 600 Mobile Harbour Crane. SWL of 208 Ton and capable of lifting 53.7 ton at 58 meters radius. Can be used for bulk container loading/unloading with our Bromma container handler attachment. Maximum hoisting height above quay of 59 metres.</li>
        </ul>
    </li>
    <li>Liebherr LR1300 Crawler Crane. <a class="add-info" href="#">Find out more</a>
        <ul class="hidden-list">
            <li>Coming December 2014 Liebherr LR1300 Crawler Crane. Can be configured to lift 300.5 ton and can be configured to a maximum radius of 80 metres. Can be fitted with a leader rig attachment and Bruce 16 ton piling hammer for piling.</li>
        </ul>
    </li>
    <li>Sennebogen 6130 Crawler Crane. <a class="add-info" href="#">Find out more</a>
        <ul class="hidden-list">
            <li>Sennebogen 6130 Crawler Crane. Can be configured to lift 136 ton and has a maximum radius of 42 metres.</li>
        </ul>
    </li>
    <li>Zoomlion RT55 Rough Terrain Crane. <a class="add-info" href="#">Find out more</a>
        <ul class="hidden-list">
            <li>RT55 Rough Terrain Crane. SWL of 54.88 ton and a maximum working radius radius of 41 metres. A main jib head height of 34 metres but also comes complete with a telescopic fly jib that can increase the head height up to a height of 54 metres and can be offset from 0 to 40 degrees.</li>
        </ul>
    </li>
    <li>Scheuerle 6 axel SPMT modular trailers complete with Z350 power pack units. <a class="add-info" href="#">Find out more</a>
        <ul class="hidden-list">
            <li>Scheuerle 6 axel SPMT modular trailers complete with Z350 power pack units. With a SWL of 48 ton per axel can be supplied in a vast array of different configurations.</li>
        </ul>
    </li>
    <li>Forklifts <a class="add-info" href="#">Find out more</a>
        <ul class="hidden-list">
            <li>Various sizes of forklifts available from 2.5 ton up to 32 ton.</li>
        </ul>
    </li>
</ul>

我想做的是在jQuery中单击“添加信息”,显示ul.hidden-list,SlideDown或其他效果,只要显示即可。

我创建了一个jsFiddle

我当前的jQuery代码:

$('.add-info').click(function() {

    $(this).children('ul.hidden-list').slideToggle();

    return false;
});
想象

根据您的标记<ul>元素,它被放置为下一个元素,<a>而不是直接后代,因此应使用.next()(或.siblings)方法:

$('.add-info').click(function() {
    $(this).next('ul.hidden-list').slideToggle();

    return false;
});

演示: http : //jsfiddle.net/vog8bsLc/1/

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

锚点上的嵌套ul show单击

来自分类Dev

单击锚点时,如何定位没有任何UL的LI

来自分类Dev

Java HtmlUnit单击锚点

来自分类Dev

Java HtmlUnit单击锚点

来自分类Dev

单击锚点内的div时取消锚点

来自分类Dev

在锚点上单击ng时,导航栏菜单为什么会闪烁?

来自分类Dev

IE 10:SCRIPT5:锚点单击事件上的访问被拒绝错误

来自分类Dev

如何使用webdriver.io单击网页上的所有锚点元素

来自分类Dev

单击父div时如何在锚点上触发click事件

来自分类Dev

单击锚点时如何停止悬停?

来自分类Dev

dynamicjs在单击时显示图像锚点

来自分类Dev

如何覆盖* only *左键单击锚点?

来自分类Dev

HTML 锚点单击事件设置变量

来自分类Dev

单击锚点后如何提醒标签

来自分类Dev

单击时使用ng-show扩展嵌套列表

来自分类Dev

单击锚点链接后触发单击事件

来自分类Dev

在包装上进行触摸和鼠标拖动事件时,如何防止锚点上的单击事件

来自分类Dev

在锚元素上设置(单击)属性

来自分类Dev

创建一个锚点,当您单击该锚点时将更改内容

来自分类Dev

防止锚点内单击DOM生成的元素时发生锚点行为

来自分类Dev

如何更改锚点外观并保持它直到单击另一个锚点

来自分类Dev

单击锚点时将内容添加到textarea

来自分类Dev

Safari在单击超链接时会忽略/删除锚点(或“标签”)?

来自分类Dev

导航时自动关闭模式(单击锚点时)

来自分类Dev

从可单击的div内的按钮中删除锚点效果

来自分类Dev

检查jQuery单击的元素是否为包含img的锚点

来自分类Dev

在锚点单击AJAX响应后警报未执行

来自分类Dev

单击引导时模态锚点时添加URL哈希

来自分类Dev

切换div(锚点单击除外)

Related 相关文章

热门标签

归档