Инициализировать функцию после клонирования объекта
Здравствуйте.
У меня на странице есть выпадающие списки в которых я использую плагин кастомного скроллбара. <div class="frlist"> <div class="ctrl"> <a class="" href="#" title=""></a> </div> <div class="list"> <div class="scrollbar"><div class="track"><div class="thumb"><div class="end"></div></div></div></div> <div class="viewport"> <div class="overview"> <div><a class="fr-1" href="#" title="">Груша</a></div> <div><a class="fr-2" href="#" title="">Яблоко</a></div> <div><a class="fr-3" href="#" title="">Банан</a></div> <div><a class="fr-4" href="#" title="">Апельсин</a></div> <div><a class="fr-5" href="#" title="">Киви</a></div> </div> </div> </div> <input type="hidden" value="" id="frname" /> </div> В шапке для данного объекта происходит инициализация функции $(document).ready(function(){ $('div.frlist').tinyscrollbar(); }); Есть кнопка, при клике на которую я клонирую div.frlist $("a.addfrlist").on("click", function() { var prev = $(this).prev("div.left"); var first = prev.find("div.list-s:first"); var count = prev.find("div.list-s").size(); first.clone().appendTo(prev).css("margin-top", "5px").find("input:hidden").attr("id", "pname"+(count+1)); return false; }); Все успешно добавляется настраницу и id нового элемента изменяется добавляя счетчик + 1, но выпадающий список у добавленных элементов не работает. Для скрипта отвечающего за выпадающий список событие изменены click() на on("click", function() {}) $("div.list").css("visibility", "hidden"); $("div.ctrl a").on("click", function() { $("div.ctrl a").removeClass("open"); if($(this).hasClass("opened")) { $(this).parent().next().css("visibility", "hidden"); } else { $(this).parent().next().css("visibility", "visible"); } $(this).toggleClass("opened"); return false; }); $("div.list a").on("click", function() { var new_cn_a = $(this).attr("class"); var new_cn_b = $(this).text(); $(this).parents("div.list").css("visibility", "hidden"); $(this).parents("div.frlist").find("div.ctrl a").removeClass().addClass(new_cn_a).text(new_cn_b); $(this).parents("div.frlist").find("input[type='hidden']").val(new_cn_a); return false; }); $("body").click(function() { $("div.ctrl a").removeClass("opened"); $("div.list").css("visibility", "hidden"); }); $("div.thumb").click(function(e) { e.stopImmediatePropagation(); }); Списки не выпадают. Подозреваю что это изза того что новые объекты остаются неинициализированными. Пожалуйста подскажите в чем проблема и как решить? |
clone(true) пробуй.
|
Класс, спасибо! Все работает.
clone(true) плюс инициализация функции и все работает: $("a.addprod").on("click", function() { var prev = $(this).prev("div.left"); var first = prev.find("div.list-s:first"); var count = prev.find("div.list-s").size(); alert(count); first.clone(true).appendTo(prev).css("margin-top", "5px").tinyscrollbar().find("input:hidden").attr("id", "pname"+(count+1)); return false; }); |
Часовой пояс GMT +3, время: 13:56. |