Question

首先：抱歉我的英语不好而且我真的不是一个jquery-pro - 所以请放轻松我。

以下是最重要的代码片段+示例...如果您需要更多帮助，请告诉我。

HTML +内联jquery图标选择器：

<div class="full" style="margin-bottom: 0;">

                                    <span class="two_fifth first" style="margin-bottom: 0;">
                                        <h3 class="skill-item-title">Symbol wählen</h3>
                                    </span>

                                    <span class="three_fifth" style="margin-bottom: 0;">

                                        <input id="icon2" type='' class="criteria_name_two show-tick" name='' style="width: 100%; float: left;" value='' placeholder="">

                                        <script type="text/javascript">
                                    jQuery(document).ready(function($) {
                                        var icons = {
                                            'Webapplikationen' : ['fa fa-car', 'fa fa-caret-square-o-down', 'fa fa-caret-square-o-left']
                                        };
                                        $('#icon2').fontIconPicker({
                                            source: icons,
                                            emptyIcon: true,
                                            hasSearch: true,
                                            allCategoryText: 'Alle Anzeigen',
                                        });
                                    });
                                    </script>
                                    </span>

                                </div>

HTML：＆＃34; Add-Service＆＃34; （调用下面的函数）：

<div class="option_item">
                        <button type="button" name="submit_add_service" id='submit_add_service' value="add" class="button-secondary"><i class="fa fa-plus-circle"></i>Service hinzufügen</button>
                    </div>

jQuery（克隆）：

//ADD SERVICE
jQuery('#template_service').hide();
jQuery('#submit_add_service').on('click', function() {      
    $newItem = jQuery('#template_service .option_item').clone().appendTo('#resume_service').show();
    var tmp = $newItem;
    tmp = $.unique( tmp );
    if ($newItem.prev('.option_item').size() == 1) {
        var id = parseInt($newItem.prev('.option_item').attr('id')) + 1;
    } else {
        var id = 0; 
    }
    $newItem.attr('id', id);

    $newItem.find('.skill-item-title span.num').text(id+1);

    var nameText = 'wpjobus_company_services[' + id + '][0]';
    $newItem.find('.criteria_name').attr('id', 'fuck').attr('name', nameText);

    var nameText = 'wpjobus_company_services[' + id + '][1]';
    $newItem.find('.criteria_name_two').attr('id', 'fuck').attr('name', nameText);

    var nameText = 'wpjobus_company_services[' + id + '][2]';
    $newItem.find('.criteria_notes').attr('id', 'fuck').attr('name', nameText);

    var nameText = 'fuck';
    $newItem.find('.criteria_icon').attr('id', 'fuck');

    //event handler for newly created element
    $newItem.children('.button_del_service').on('click', function () {
        jQuery(this).parent('.option_item').remove();
    });

});

示例：http://kufifi.at/test/last/2.html

问题用几句话说：在我调用Clone（）函数后，选择器出现两次。我的猜测是，它与尚未准备好的DOM或多个ID有关，但正如我所说，我对jquery并不是很好，我真的很喜欢以此结束。

对于糟糕的代码感到抱歉 - 我玩＃34;试图解决问题的最后一天真的很多。

希望有人可以帮助我。

谢谢， NiXxon。

Answer 1

我自己得到了它，并在stackoverflow的其他帖子中提供了一些帮助。如果有人感兴趣：我通过在我的克隆功能中添加以下内容来解决它：

$newItem.find('.criteria_icon').fontIconPicker();

有时它比你想象的更简单......

图标选择器在克隆功能后多次显示

1 个答案: