Bootstrap V2 выпадающая навигация не работает в мобильных браузерах

нашли это исправление для версии 2.3.2:

<script>
jQuery(document).ready(function($)  {
$("li.dropdown a").click(function(e){
    $(this).next('ul.dropdown-menu').css("display", "block");
    e.stopPropagation();
  });
}); </script>     

работала на двух отдельных систем сча я построил.

Я использую BootStrap 3.1.1. Я пробовал много ответов, выпадающее меню работает на устройствах Android, но не работает на устройстве iOS. Наконец я нахожу первопричину проблемы.

safari на iPhone поддерживает только событие click для <a> и <input> элемент. Смотрите этот отрывок нажмите делегирование событий на iPhone.

поэтому нам нужно добавить пользовательское делегирование щелчка. Следующий код решит проблему.

$('[data-toggle=dropdown]').each(function() {
 this.addEventListener('click', function() {}, false);
});

я решил эту же проблему этим:

1.Открой свой js/bootstrap-dropdown.js или его уменьшенная версия.

2.Найти для линий или мест для:touchstart.dropdown.data-api

3.Из них должно быть только 4. Что-то вроде этого:--6-->

.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)

вы должны вставить эту новую строку между 2-м и 3-м случаями:

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

4.Ваш новостной фрагмент кода должен быть примерно таким:

.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)

будьте осторожны на уменьшенных версиях Загрузчик.js... таким образом, вы должны объединить новую строку в точном положении на ней.

удачи! :)

Я нашел решение этого с форума bootstrap git-hub. Вам нужно включить только одну строку кода в скрипт на документе ready as,

$('body').о как touchstart ('.выпадающий список','.выпадающее меню', функция (e) { e.stopPropagation ();});

его работа для меня!!!

Я рекомендую загрузить последние загрузочные файлы и заменить загрузочный файл.JS и ушко.минута.js на вашем сервере с новыми версиями.

это исправило проблему для меня.

Это, кажется, работает без каких-либо проблем. Класс "open" уже существует с bootstrap и должен работать, но по какой-то причине это не так. Этот код заставляет его работать соответствующим образом. :)

    jQuery(document).ready(function($) {
    $("li.dropdown").click(function(e){
        $(this).toggleClass("open");
        });
    });

похоже, что все это работает для меня, может быть, попробуйте заменить файлы начальной загрузки новой копией, если вы случайно что-то испортили. Или если это не работает, убедитесь, что вы импортируете все. Вы уверены, что импортируете все файлы CSS и JS?

когда вы нажимаете на раскрывающийся список, он добавляет open класс <li class="dropdown"> даю вам: <li class="dropdown open">. Когда вы нажимаете ссылку в раскрывающемся меню или " пункт меню 2 (раскрывающийся список)",open класс удаляется, в результате чего dropmenu снова складывается.

ниже fiddle показывает, как остановить распространение события click, но может вызвать проблемы еще где. Кроме того, я только предотвратил распространение по пункту #1 в раскрывающемся списке. Вы можете использовать jQuery, чтобы это произошло на всех элементах выпадающего списка.

JS Fiddle:http://jsfiddle.net/yDjw8/2/

это исправление предназначено для Bootstrap 2.3.2 и основано на ответе @asbanks (https://stackoverflow.com/a/18107103/437019).

поверх ответа asbanks этот скрипт также распространяет вызовы JS из ссылок внутри раскрывающихся списков, а открытый раскрывающийся список закрывает другие открытые.

$(function() {
  return $("a.dropdown-toggle:not(.multiselect)").click(function(e) {
    $("ul.dropdown-menu:not(.multiselect-container)").css("display", "none");
    $(this).next("ul.dropdown-menu").css("display", "block");
    return e.stopPropagation();
  });
});

$(document).on('click click.dropdown.data-api', function(e) {
  if (!$(e.target).closest('.dropdown, .multiselect-container').length) {
    return $("ul.dropdown-menu:not(.multiselect-container)").css("display", "none");
  }
});

Я использую bootstrap-3.3.1, и я испытываю ту же проблему в приложении Android phonegap.

Я нашел забавный способ после нескольких проб и ошибок:

// clueless hack here!!!! otherwise dropdown menu doesn't work
$('.dropdown-toggle').dropdown('toggle');
$('.dropdown-toggle').dropdown('toggle');

jquery-1.11.2, bootstrap-3.3.2:

$('#yourId').on('hidden.bs.dropdown', function (){
    $(this).click(function (event) {
       $('.dropdown-toggle').dropdown('toggle'); 
    });
});

Я считаю, что если вы сделаете следующее, ссылки будут работать правильно

$(document).ready(function(){
            $('.youClass').click(function(){
                var menuItem = '<a class=" " href=" ">Log Out</a>';

                $('.anotherClass').append('<li class=".youClass">'+ menuItem +'</li>');

            });
        });

добавлять role="button" до <a href="#" class="dropdown-toggle" data-toggle="dropdown">Menu Item 2 (Dropdown)<b class="caret"></b></a> работал для меня

<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button">Menu Item 2 (Dropdown)<b class="caret"></b></a>