Динамическая вложенная вкладка jQuery Mobile со встроенными кнопками

0

Есть ли у кого-нибудь предложения по созданию вложенных коллажей с встроенными кнопками. В прикрепленном jsbin, щелкнув по встроенной кнопке в статическом сворачиваемом, динамически гнездятся дополнительные складки с помощью собственной кнопки. Проблема в том, что я не вижу ссылки на динамически создаваемую коллекционную кнопку, чтобы процесс продолжался. Я попытался использовать как trigger(), так и extendedWithin() в родительском элементе кнопок.

http://jsbin.com/helif/4/edit

Теги:
jquery-mobile

1 ответ

1

Делегация мероприятия должна работать:

$(document).on("click", ".collapsibleButton", function(e){...});

Это должно привязываться к любым динамически созданным кнопкам с этим именем класса.

Если это не сработает для вас, то каждый раз, когда вы создаете динамическую сворачиваемость, используйте.off(), чтобы удалить обработчик кликов и.on(), чтобы повторно добавить его:

$(".collapsibleButton").on("click", function(e){
        onClick(e);
});

function onClick(e){
        alert("COLLAPSIBLE BUTTON CLICKED");
        console.log("clicked on "+$(e.target).attr('class') );      
        var element =
        "<div data-role='collapsible' class='collapsible' data-collapsed='false'>" +
            "<h3 class='collapsibleTitle'><p>Dynamic Collapsible</p>" +
                "<div class='button-set' style='float: right'>" +
                    "<input type='button' class='collapsibleButton' value='Button' data-mini='true' data-icon='gear' data-icon-pos='top' />" +
                "</div>" +
            "</h3>" +
            "<div class='content'><p>CONTENT</p></div>" +
        "</div>";

        $(element).appendTo($(e.target).closest('.collapsible').find('.content:first'));
        $(e.target).closest('.collapsible').find('.content:first').enhanceWithin();
        $(e.target).closest('.collapsible').find('.content:first').find('.button-set:first').enhanceWithin();      

        $(".collapsibleButton").off("click").on("click", function(e){
            onClick(e);
        });

        e.stopPropagation();
        e.stopImmediatePropagation();  
        return false;

}
  • 0
    Ваше решение работает хорошо. Спасибо за уделенное время.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню