文章/答案/技术大牛

发布

社区首页 >问答首页 >如何实现类中类的单击处理程序？

问如何实现类中类的单击处理程序？
EN

Stack Overflow用户

提问于 2017-08-24 13:55:28

回答 1查看 54关注 0票数 1

我在这样的表格中为每一行设置了一个菜单选项。

菜单选项类是“切换-包装”，表行类是“文本左”。这是我的菜单选项，单击处理程序

    (function($){

           $( '.toggle' ).click(function(){
             var target = $( this ).data( 'menu' );

             $( '#' + target ).toggleClass( 'menu--open' );
           });

        })(jQuery);

处理程序在菜单选项本身就可以工作，但是当我将菜单选项类添加到下面代码中的表行类中时，我无法让单击处理程序工作。

  <td class="text-left" >

                     <div class="toggle-wrap">
                        <button class="toggle" data-menu="settings"><i class="fa fa-cog"></i><span>Settings</span></button>
                        <ul class="menu menu--toggle" id="settings">
                          <li class="menu__item">Edit My Profile<i class="fa fa-user"></i></li>
                          <li class="menu__item">Edit Account Details<i class="fa fa-list"></i></li>
                          <li class="menu__item">Need Help<i class="fa fa-support"></i></li>
                          <li class="menu__item">Sign Out<i class="fa fa-lock"></i></li>
                        </ul>
                      </div>


                  </td>

我做错什么了？

jquery

html

css

回答 1

Stack Overflow用户

回答已采纳

发布于 2017-08-24 16:41:42

您正在创建的菜单是动态生成的，因此它是在javascript调用之后创建的，该调用将事件侦听器附加到.toggle元素。

你能做的就是利用事件冒泡。尝试一些容器元素，它在javascript调用运行时是静态存在的，它附加了事件侦听器，并且您确信它将包含.toggle元素。使用jquery.on将事件侦听器附加到此容器，并将选择器.toggle放在选择器参数中：

$(container).on('click', '.toggle', handler)

的工作方式：

单击.toggle元素时，单击事件会出现气泡，即它的父元素将了解此事件。一旦到达容器元素，我们的处理程序就会被调用。

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/45863527

复制

相似问题

问如何实现类中类的单击处理程序？
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何实现类中类的单击处理程序？EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何实现类中类的单击处理程序？
EN