Bootstrap v2 Dropdown Navigation not working on Mobile Browsers

前端 未结 14 1182
遥遥无期
遥遥无期 2020-11-28 06:22

I am having an issue with the Bootstrap menu dropdowns on mobile devices (Bootstrap 2). A similar question was asked here with dropdown buttons, however the answer for that

14条回答
  •  悲哀的现实
    2020-11-28 06:45

    I solved this same problem doing this:

    1.Open your js/bootstrap-dropdown.js or the minified version of it.

    2.Find for the lines or places for: touchstart.dropdown.data-api

    3.There should be only 4 occurs of it. Something like this:

    .on('click.dropdown.data-api touchstart.dropdown.data-api', clearMenus)
    .on('click.dropdown touchstart.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() })
    .on('click.dropdown.data-api touchstart.dropdown.data-api'  , toggle, Dropdown.prototype.toggle)
    .on('keydown.dropdown.data-api touchstart.dropdown.data-api', toggle + ', [role=menu]' , Dropdown.prototype.keydown)
    

    You should insert this new line between the 2nd and 3rd occurences:

    .on('touchstart.dropdown.data-api', '.dropdown-menu', function (e) { e.stopPropagation() })
    

    4.Your news piece of code must be something like this:

    .on('click.dropdown.data-api touchstart.dropdown.data-api', clearMenus)
    .on('click.dropdown touchstart.dropdown.data-api', '.dropdown form', function (e) { e.stopPropagation() })
    .on('touchstart.dropdown.data-api', '.dropdown-menu', function (e) { e.stopPropagation() })
    .on('click.dropdown.data-api touchstart.dropdown.data-api'  , toggle, Dropdown.prototype.toggle)
    .on('keydown.dropdown.data-api touchstart.dropdown.data-api', toggle + ', [role=menu]' , Dropdown.prototype.keydown)
    

    Be careful on minified versions of Bootstrap.js... so you must concatenate the new line at the exact position on it.

    Good luck! :)

提交回复
热议问题