Show bs modal не работает

загрузчик jquery show.bs.modal событие не сработает

Я использую модальный пример из загрузочного документа 3. модальные работы. однако мне нужно получить доступ к событию show.bs.modal, когда он срабатывает. пока я просто пытаюсь:

Ничего не происходит, событие не срабатывает. Что я делаю не так. Для меня это не имеет смысла.

15 ответов

Убедитесь, что вы положили свой on(‘shown.bs.modal’) , прежде чем создавать модальный текст.

Чтобы сфокусироваться на поле, лучше использовать shown.bs.modal вместо show.bs.modal , но, возможно, по другим причинам вы хотите скрыть что-то фон или установить что-то прямо перед началом показа модала, используйте кнопку show.bs.modal .

Без него JavaScript выполняется до загрузки документа, а #myModal еще не является частью DOM. Вот ссылка Bootstrap.

Используя shown вместо show , также убедитесь, что у вас есть полные двоеточия в конце вашей функции и предупреждения.

Аналогичная ситуация со мной произошла, и я решил использовать setTimeout.

Bootstrap использует следующий таймаут, чтобы завершить показ:

c.TRANSITION_DURATION = 300, c.BACKDROP_TRANSITION_DURATION = 150,

Поэтому использование более 300 должно работать, и для меня работает 200:

В моем случае я отсутствовал.modal-dialog div

Не срабатывает событие: показано.bs.modal

Событие пожара: показано.bs.modal

Не забудьте поставить script после вызова «js/bootstrap», а не раньше.

У меня была аналогичная, но другая проблема, и я все еще не могу работать, когда я использую $(‘# myModal’). Я смог заставить его работать, когда я использую $(window).

Моя другая проблема заключается в том, что я обнаружил, что событие show не срабатывает, если я сохранил свой модальный контент div html в переменной javascript, например.

событие никогда не запускалось, потому что оно не происходило

мое исправление должно было включать divs в тело html

Убедитесь, что вы загружаете jQuery перед использованием Bootstrap. Звучит просто, но у меня возникли проблемы с этими модальными событиями и получается, что ошибка была не с моим кодом, а тем, что я загружал Bootstrap перед jQuery.

Иногда это не работает, если:

1) у вас есть ошибка в коде java-скрипта перед вашей строкой с $(‘#myModal’).on(‘show.bs.modal’. ) . Чтобы устранить неполадки, поместите предупреждающее сообщение перед строкой, чтобы узнать, появляется ли оно при загрузке страницы. Чтобы устранить исключенные JS выше, чтобы узнать, какая из них является проблемой

2) Еще одна проблема заключается в том, что вы загружаете JS в неправильном порядке. Например, вы можете иметь часть $(‘#myModal’).on(‘show.bs.modal’. ) прежде чем загружать JQuery.js. В этом случае ваш вызов будет проигнорирован, поэтому сначала в HTML (убедитесь, что на странице просмотра страницы) убедитесь, что ссылка на сценарий JQuery выше вашего модального вызова onShow , иначе он будет проигнорирован. Чтобы устранить неполадки, поставьте предупреждение внутри него, чтобы показать его раньше. Если вы видите одно, а не одно внутри функции onShow, то ясно, что функция не может выполнить. Если правописание правильное, скорее всего, ваш вызов JQuery.js не будет выполнен или он будет сделан после части onShow

Убедитесь, что вы действительно используете модал начальной загрузки jquery, а не другую модальность jquery.

Источник

Bootstrap $(‘#myModal’).модальный (‘show’) не работает

Я не уверен, почему, но все ладовые функции не работают со мной. Я проверил версию и загрузку, они в порядке.

Я продолжаю получать это сообщение об ошибке:

Uncaught TypeError: $(. ).modal is not a function

для шкуры я уже нашел альтернативу. вместо:

я использовал этот :

и он отлично работает.

проблема теперь с шоу

Я тоже пробовал оба!—8—>

но, к сожалению, ни один из них не работает.

здесь html-код — при нажатии кнопки я сделаю некоторую проверку и обрабатывать данные json из веб — службы, если это удастся, то я хочу показать мой модальный-все работает, кроме шоу.

если есть какая-либо альтернатива, я хотел бы знать это.

9 ответов

наиболее распространенной причиной таких проблем являются

1.Если вы определили библиотеку jquery несколько раз.

библиотека начальной загрузки применяется к первой библиотеке jquery, но при перезагрузке библиотеки jquery исходная загрузка начальной загрузки теряется (модальная функция находится в начальной загрузке).

2.Пожалуйста, оберните свой код JavaScript внутри

3.Пожалуйста, проверьте, если id модального это же

как тот, который вы определили для компонента (также проверьте дублирование того же идентификатора ).

Я получил ту же проблему при работе с модальным всплывающим загрузчиком , я использовал Id и триггер click event для показа и скрытия модального всплывающего окна вместо $(«#Id»).модальные (‘show’) и $(«#id»).модальный (‘скрыть’), `

моей основной причиной было то, что я забыл добавить # перед именем ID. Неубедительно, но верно.

для вашей справки, кодовая последовательность, которая работает для меня

попробуйте это без paramater

вы уверены, что идентификатор модального является «myModal»? если нет, то вызов не сработает это.

также-просто от чтения Вашего сообщения — вы запускаете функцию / проверку с помощью этой кнопки

и потом, если все хорошо — вы хотите, чтобы вызвать модальное. — если это случай hte-то вы должны удалить переключатель из этой кнопки нажмите. Я предполагаю, что у вас есть обработчик событий, связанный с этим щелчком? вам нужно .модальный («show») как часть этой функции. не переключается с этой кнопки. также — это идентификатор правильные «creatNewAcount» в противоположность этому слово «createNewAccount»

используйте объект для вызова.

или если вы используете ajax, чтобы показать, что модальный после получения результата, это работа для меня.

первый скрипт googleapis не работает сейчас дни используют эту вторую скрипту, данную jquery

jQuery lib должен быть загружен первым. В моем случае я сначала загружал bootstrap lib, также пробовал тег с целью и запускал триггер щелчка. Но главная проблема была — jquery должен быть загружен первым.

использовать .modal() и .modal() вместо (‘show’) и (‘hide’) . кажется, это зависит от комбинации версий bootstrap/jquery. Надеюсь, это поможет.

Источник

bootstrap jquery show.bs.modal event won’t fire

i’m using the modal example from the bootstrap 3 docs. the modal works. however i need to access the show.bs.modal event when it fires. for now i’m just trying:

Nothing happens, the event does not fire. What am I doing wrong. This doesn’t make sense to me.

20 Answers 20

Make sure you put your on(‘shown.bs.modal’) before instantiating the modal to pop up

To focus on a field, it is better to use the shown.bs.modal in stead of show.bs.modal but maybe for other reasons you want to hide something the the background or set something right before the modal starts showing, use the show.bs.modal function.

Wrap your function in $(document).ready(function() < >) , or more simply, $(function() < . In CoffeeScript, this would look like

Without it, the JavaScript is executing before the document loads, and #myModal is not part of the DOM yet. Here is the Bootstrap reference.

Using shown instead of show also make sure you have your semi colons at the end of your function and alert.

Similar thing happened to me and I have solved using setTimeout.

Bootstrap is using the following timeout to complete showing:

So using more than 300 must work and for me 200 is working:

In my case, I was missing the .modal-dialog div

Doesn’t fire event: shown.bs.modal

Does fire event: shown.bs.modal

I had the same issue with bootstrap4. The solution was to add it inside the jQuery document ready() function:

I had a similar but different problem and still unable to work when I use $(‘#myModal’). I was able to get it working when I use $(window).

My other problem is that I found that the show event would not fire if I stored my modal div html content in a javascript variable like.

the event never fired because it didn’t occur

my fix was to include the divs in the html body

Remember to put the script after the call of «js/bootstrap», not before.

This happens when code might been executed before and it’s not showing up so you can add timeout() for it tp fire.

Ensure that you are loading jQuery before you use Bootstrap. Sounds basic, but I was having issues catching these modal events and turns out the error was not with my code but that I was loading Bootstrap before jQuery.

Sometimes this doesn’t work if:

1) you have an error in the java script code before your line with $(‘#myModal’).on(‘show.bs.modal’. ) . To troubleshoot put an alert message before the line to see if it comes up when you load the page. To resolve eliminate JSs above to see which one is the problem

2) Another problem is if you load up the JS in wrong order. For example you can have the $(‘#myModal’).on(‘show.bs.modal’. ) part before you actually load JQuery.js. In that case your call will be ignored, so first in the HTML (view page source to be sure) check if the script link to JQuery is above your modal onShow call, otherwise it will be ignored. To troubleshoot put an alert inside the on show an one before. If you see the one before and not the one inside the onShow function it is clear that the function cannot execute. If the spelling is right more than likely your call to JQuery.js is not made or it is made after the onShow part

Had the same issue. For me it was that i loaded jquery twice in this order:

1. Loaded jQuery
2. Loaded Bootstrap
3. Loaded jQuery again

Источник

Модальное событие Bootstrap «show.bs.modal» не срабатывает при объявлении в iframe

Ik создал и инициализировал модальность Bootstrap в родительском документе, а событие «показанное.bs.modal» объявлено в iframe на готовом документе. Документы parent и iframe находятся в одном домене. Проблема в том, что это событие не срабатывает при открытии модального файла. Любые идеи, почему это не работает?

Модальный html в родительском документе:

jQuery в родительском документе:

jQuery в iframe:

Я использую jQuery 1.11.2 и Bootstrap 3.

Когда дело доходит до iframes, вы в основном взаимодействуете с двумя разными страницами (возможно, из двух разных доменов). Поэтому, когда вы запускаете событие в iframe, оно запускает событие только в этом iframe, а не в основном документе. Причина, по которой он не работает, может быть вызван тем, что браузер не позволяет этого.

Работа будет заключаться в использовании Jquery postMessage который позволяет вам общаться с двумя страницами. Итак, в основном, что вам нужно сделать, это когда в главном документе запускается событие, отправьте postMessage в iframe. Получите postMessage в iframe, а затем покажите модель в iframe.

Другой способ сделать это — использовать getScript вместо использования iframe. Код будет выглядеть примерно так:

Подойдя к этому подходу, вы сможете добиться желаемой функциональности (на основе комментариев). Когда вы нажимаете кнопку, которая запускает модальную, она вызывается $.getScript и выполняет набор команд (может использоваться для создания событий добавления). После того, как он будет успешно выполнен, он покажет модель с обновленными событиями.

Источник

Загрузчик jquery show.bs.modal событие не сработает

Я использую модальный пример из начальной загрузки 3 документа. модальные работы. однако мне нужно получить доступ к событию show.bs.modal при его запуске. сейчас я просто пытаюсь:

Ничего не происходит, событие не срабатывает. Что я делаю неправильно. Это не имеет смысла для меня.

20 ответов

Убедитесь, что вы положили on(‘shown.bs.modal’) перед созданием модального окна

Чтобы сосредоточиться на поле, лучше использовать shown.bs.modal вместо show.bs.modal но, возможно, по другим причинам вы хотите что-то скрыть на заднем плане или установить что-то прямо перед тем, как модал начинает показывать, используйте show.bs.modal функция.

Без этого JavaScript выполняется до загрузки документа, и #myModal еще не является частью DOM. Вот ссылка на Bootstrap.

С помощью shown вместо show также убедитесь, что у вас есть свои точки с запятой в конце вашей функции и оповещения.

Подобная вещь произошла со мной, и я решил с помощью setTimeout.

Bootstrap использует следующий таймаут для завершения показа:

c.TRANSITION_DURATION = 300, c.BACKDROP_TRANSITION_DURATION = 150,

Так что использование более 300 должно работать, а у меня 200 работает:

У меня была похожая, но другая проблема, и я все еще не мог работать, когда использую $(‘#myModal’). Я смог заставить его работать, когда я использую $ (окно).

Другая моя проблема заключается в том, что я обнаружил, что событие show не сработает, если я сохраню свой модальный div-контент html в переменной javascript, например.

событие никогда не срабатывало, потому что оно не произошло

я решил включить div в тело html

У меня была такая же проблема с bootstrap4. Решением было добавить его в функцию ready() документа jQuery:

В моем случае я пропустил div.modal-dialog

Не запускает событие: selected.bs.modal

Запускает ли событие: показано.bs.modal

Не забудьте поставить скрипт после вызова «js/bootstrap», а не до.

Это происходит, когда код мог быть выполнен раньше, но он не отображается, поэтому вы можете добавить для него timeout() tp fire.

Источник