javascript - JQ如何将两个标签关联起来啊?
天蓬老师
天蓬老师 2017-04-10 14:56:13
[JavaScript讨论组]
<p id="navbb">
      <ul class="nav navbar-nav">
        <li><a href="#">a</a></li> 
        <li><a href="#">b</a></li> 
        <li><a href="#">c</a></li> 
      </ul>
      <p class="abc">a</p>
      <p class="abc">b</p>
      <p class="abc">c</p>
</p>

假设p abc已经被隐藏
我想实现的效果是点击li里面的A的时候触发的就是显示下面p a。点击B的时候触发下面的p b。是如何做到让li(a)和p(a)对应上的呢?
因为最后会用PHP循环这段代码,

<p id="navbb">
      <ul class="nav navbar-nav">
        <li><a href="#">a</a></li> 
      </ul>
      <p class="abc">a</p>
</p>

如何做到无论循环多少次他们都能触发对应p的显示呢?

天蓬老师
天蓬老师

欢迎选择我的课程,让我们一起见证您的进步~~

全部回复(2)
迷茫

首先,关于上下的关联我建议你用data-属性。不过你目前没用data-,那我就先按照顺序对应了。
下面这是按对a标签后,对应的p自动toggle,你可以根据你的需要来改。

$('#navbb').find('ul').on('click', 'a', function(event) {
    var index = $(event.currentTarget).parent().index();
    $('#navbb p:eq(' + index + ')').toggle()
})
黄舟

http://segmentfault.com/q/1010000002537374

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号