为了账号安全,请及时绑定邮箱和手机立即绑定

bootstrap中下拉菜单如何通过鼠标移入事件触发?

/ 猿问

bootstrap中下拉菜单如何通过鼠标移入事件触发?

_蛋蛋_ 2016-05-10 17:54:55

如题,希望通过鼠标移入事件触发bootstrap中的下拉菜单

查看完整描述

7 回答

?
一毛钱

获取此元素,然后给这个元素添加事件就可以了

查看完整回答
3 反对 回复 2016-05-10
  • _蛋蛋_
    _蛋蛋_
    具体呢?如果只是给这个元素添加时间 但是下拉菜单不能选择了
?
zbb_mooc

补个截图给你//img1.sycdn.imooc.com/5732a3680001defc09870577.jpg

查看完整回答
1 反对 回复 2016-05-11
?
TonyMaYun

完美解决

$(".ms-dropdown").mouseover(function () {

                $(".dropdown").addClass('open');

            });

            $(".ms-dropdown").mouseleave(function () {

                $(".dropdown").removeClass('open');

            });

            $('.dropdown-menu').mouseover(function () {

                $(".dropdown").addClass('open');

            });

            $('.dropdown-menu').mouseleave(function () {

                $(".dropdown").removeClass('open');

            });



查看完整回答
反对 回复 2019-01-03
?
zbb_mooc

不小心发现给你的有个bug,就是没法选择菜单项了。

查看完整回答
反对 回复 2016-05-11
?
zbb_mooc
  <script type="text/javascript">
      $(document).ready(function(){
        $("#dropdownMenu1").mouseover(function(){
           $("#dropdownMenu1").click();
        });
        $("#dropdownMenu1").mouseout(function(){
            $(this).click();    
        });
      })
  </script>

试试看代码语言效果。

查看完整回答
1 反对 回复 2016-05-11
?
zbb_mooc

这是在慕课网bootstrap里教学视频【玩转Bootstrap(基础)】5-1添加你要的效果的测试: 测试 (不知道链接能不能用)

查看完整回答
反对 回复 2016-05-11
?
zbb_mooc

bootstrap里菜单是要单击才能实现的出现下拉菜单项的,如果想鼠标移入就触发出现下拉菜单项可以用jquery实现如我测试的例子。

      $(document).ready(function(){

        $("#dropdownMenu1").mouseover(function(){

           $("#dropdownMenu1").click();

        });

        $("#dropdownMenu1").mouseout(function(){

            $(this).click();    

        });

      })


查看完整回答
反对 回复 2016-05-11

添加回答

回复

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信