Блог

У меня есть цветовое поле, показывающее встроенный элемент DOM.

При первом отображении colorbox все работает нормально, но если я закрою его и попытаюсь открыть снова, это не сработает.

При создании colorbox дочерние элементы #my-content-div удаляются, а в #my-content-div добавляется display: none, и цветовое поле отображается нормально. Но содержимое #my-content-div не учитывается.

Вот мой HTML:

 <div style="display: none;">
        <div id="my-content-div">
            My content!!
        </div>
</div>

<input type="button" id="show-my-content" value="Click to show my content">
  

мой JS:

 $(document).ready(function () {
    $('#show-my-content').live('click', function(){
        $.colorbox({
            inline: true,
            href: "#my-content-div"
        });
    });
});
  

попробуйте изменить .live() на .on

 $(document).ready(function () {
    $('#show-my-content').on('click', function(){
        $.colorbox({
            inline: true,
            href: "#my-content-div"
        });
    });
});
  

Начиная с jQuery 1.7, метод .live() устарел. Используйте .on() для подключения обработчиков событий. Пользователи старых версий jQuery должны использовать.делегировать() предпочтительнее .live().

src: jQuery .live()