<div class="container">
<div class="row" style="padding-top: 240px;">
<a href="#" class="btn btn-large btn-primary" rel="popover"
data-content="<form><input type="text"/></form>"
data-placement="top" data-original-title="Fill in form">Open form</a>
</div>
</div>
Я предполагаю, что сохраню содержимое формы в функции javascript ...
Как мне разместить форму в всплывающем окне начальной загрузки?
javascript
jquery
twitter-bootstrap
twitter-bootstrap-3
popover
user1438003
источник
источник
Я бы поместил свою форму в разметку, а не в какой-то тег данных. Вот как это могло работать:
Код JS:
Разметка HTML:
Демо
Альтернативные подходы:
X-редактируемый
Возможно, вы захотите взглянуть на X-Editable . Библиотека, которая позволяет вам создавать редактируемые элементы на вашей странице на основе всплывающих окон.
Веб-компоненты
Майк Костелло выпустил веб-компоненты Bootstrap . В этой отличной библиотеке есть компонент Popovers, который позволяет вставлять форму как разметку:
Демо
источник
data-title="Some Title"
в<a id="myID">
тег, потому что у него нет лишнего div ...trigger
вариант. (trigger: 'focus'
)источник
как эта рабочая демонстрация http://jsfiddle.net/7e2XU/21/show/# * Обновление: http://jsfiddle.net/kz5kjmbt/
Код JavaScript:
Скриншот
источник
:)
Вы можете загрузить форму из скрытого
div
элемента с помощьюhidden
класса, предоставленного Bootstrap .JavaScript:
источник
$(...).parent().html()
на$(...).clone()
;)Или попробуйте это
Второй включает в себя второй скрытый контент div, чтобы форма работала и тестировалась на скрипке http://jsfiddle.net/7e2XU/21/
источник
Полное решение для всех, кому это может понадобиться, я использовал его до сих пор с хорошими результатами
JS:
HTML:
CSS:
источник
Я много работаю в WordPress, поэтому использую PHP.
Мой метод состоит в том, чтобы содержать мой HTML-код в переменной PHP, а затем отображать эту переменную в
data-content
.вместе с
источник