Twitter BootStrap Модальное окно резервного соединения

Я использую модные окна Twitter Bootstrap. Просто отключите модальные окна, которые не работают из-за ошибки js, - имеют откидные страницы. Как я могу убедиться, что страница загружена, если модальное окно не загружается?

Ссылка на открытие модального окна

<a href="#login-modal" data-toggle="modal" data-target="#login-modal">Login</a>

Модальное окно

<!-- Login Modal -->
        <div id="login-modal" class="modal hide fade landing-modal" tabindex="-2" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    ×
                </button>
                <h3>Login</h3>
            </div>
            <div class="modal-body">
                <form>
                    <div class="control-group">
                        <label for="email">Email Address</label>
                        <div class="controls">
                            <input class="input-medium" name="email" type="text"  />
                        </div>
                    </div>
                    <div class="control-group">
                        <label for="password">Password</label>
                        <div class="controls">
                            <input class="input-medium" name="password" type="password" />
                        </div>
                    </div>
                    <div class="control-group">
                        <label class="checkbox">
                            <input type="checkbox" value="">
                            Remember me</label>
                    </div>
                    <div class="control-group">
                        <div class="controls">
                            <button type="submit" class="button">
                                Login
                            </button>
                        </div>
                    </div>
                </form>
            </div>
        </div>

Когда я пытаюсь добавить ссылку на href следующим образом

 <a href="login.html" data-toggle="modal" data-target="#login-modal">Login</a>

Связанные нагрузки страницы в модальном окне!

enter image description here

Ответы

Ответ 1

Глядя на строку 223 в bootstrap-modal.js, я обнаружил, что происходит:

, option = $target.data('modal') ? 'toggle' : $.extend({ remote:!/#/.test(href) && href }, $target.data(), $this.data())

При использовании данных api модальная проверка, если атрибут href не является идентификатором и устанавливает это как значение для параметра remote. Это заставляет страницу загружать контент data-target изначально, а затем загружать содержимое href после содержимого remote.

Чтобы избежать загрузки содержимого href в модальный, вам нужно указать data-remote="false" по вашей ссылке:

<a href="/some-login-page.html" data-toggle="modal" data-target="#login-modal" data-remote="false">Login</a>

Ответ 2

Плагин Modal имеет приоритет для атрибута data-target. Затем вы можете использовать href, чтобы указать на резервную ссылку, которую вы хотите. Поскольку плагин Modal вызывает preventDefault в клике событиях, соответствующих селектору [data-toggle="modal"], ссылка будет выполняться только в том случае, если JavaScript отключен (или плагин Modal не загружен).

Однако следует иметь в виду, что плагин Modal использует атрибут href для загрузки удаленного контента. Чтобы обойти эту функцию от активации, просто введите "#" в конце значения href.

<a href="/some-login-page.html#" data-toggle="modal" data-target="#login-modal">Login</a>