在“就绪”和“单击”上运行函数，但不运行已存在的元素。

Question

我只是个系统管理员，对JS不太在行。我写了这段代码

// initializing libraries flatpikr, inputmask and sortable
function initializeFormLib(){
    //for datepicker only where is not already initialized
    jQuery('[name="data-partenza"]:not(.flatpickr-input)').flatpickr({
        locale:'it', 
        minDate: "today",
        dateFormat: "Y-m-d",
        ariaDateFormat: "Y-m-d",    
        disableMobile: true,
        altInput: true,
        altFormat: "j F Y", 
    });
    //for input masks
    jQuery('[name="destinazione"],[name="sistemazione"]').inputmask({
        regex:"([A-zÀ-ú\ ]+)",
        "placeholder": "",
        "onincomplete": function(){ jQuery(this).attr('value','').val('')}
    });
    jQuery('[name="tipologia"]').inputmask({
        regex:"([A-zÀ-ú\ ]+)",
        "placeholder": "",          
        "onincomplete": function(){ jQuery(this).attr('value','').val('')}
    });             
    jQuery('[name="prezzo"]').inputmask({
        mask:"99[9].99",
        "onincomplete": function(){ jQuery(this).attr('value','').val('')}
    });
    //for sortable
    jQuery(".sortable").sortable({  item: ".duplicable", });
};
jQuery(document).on('ready', function () {
    initializeFormLib();
});

正如您可以看到的，这是提供一些库的形式，如日历输入掩码等，这是正常工作的预期。问题是表单通过单击具有类‘dashicons alt’的加号图标来动态地增加字段的数量。这发生在正在工作的代码中，并且在最后再次运行initializeFormLib()，因此新添加的字段也有日历等。

//duplication
jQuery(document).on("click", ".dashicons-plus-alt", function() {
    <?php ob_start(); ?>
    var formDatiEvento = <?php echo json_encode(formDatiEvento(['destinazione'][''])) ?>;
    <?php echo ob_get_clean(); ?>   
    var formDatiEventoObj = jQuery(formDatiEvento)[0].outerHTML;
    var duplicable = jQuery(this).closest('.duplicable');
    var duplicableClasses = duplicable[0].classList[0];
    duplicable.after(jQuery(formDatiEventoObj).find('.' + duplicableClasses)[0].outerHTML);
    //svuoto i campi e animo la duplicazione
    jQuery('.duplicable').fadeIn('slow');
    //clicco sul bottone per il collapse delle date in maniera da riadattare l'altezza del container
    if ( jQuery(this).closest('.container-data').height() > 40 ) {
        jQuery(this).closest('.container-data').find('.dashicons-arrow-down-alt2').click();
    }
    //reinitializing libraries flatpikr, inputmask and sortable
    initializeFormLib();
});

这里的问题是，当我单击加号按钮时，代码将在现有字段上再次运行函数initializeFormLib()，这将破坏诸如销毁已填充的日历或打破输入掩码等功能。我修正了将一个条件应用于平面选择器的日历端: not (. flatpicker but )，这样我就可以避免在已经存在的字段上运行平面选择器，但是输入掩码库没有向初始化字段添加任何特定的类，而且我认为这不是正确的方法，只是一个错误的修复。

Answer 1

我用这种方式修好了

//un po di funzioni da eseguire quando inizializzo il form (es. calendario, riposizionamenti,maschere ecc)
function initializeFormLib(){
    //per datepicker solo dove non è stato inizializzato
    jQuery('[name="data-partenza"]:not(.flatpickr-input)').flatpickr({
        locale:'it', 
        minDate: "today",
        dateFormat: "Y-m-d",
        ariaDateFormat: "Y-m-d",    
        disableMobile: true,
        altInput: true,
        altFormat: "j F Y", 
    });
    //per campi mascherati
    jQuery
    jQuery('[name="destinazione"]:not(".masked"),[name="sistemazione"]:not(".masked"),[name="tipologia"]:not(".masked")').addClass('masked').inputmask({
        regex:"([A-zÀ-ú\ ]+)",
        "placeholder": "",
        "onincomplete": function(){ jQuery(this).attr('value','').val('')}
    });
    jQuery('[name="prezzo"]:not(".masked")').addClass('masked').inputmask({
        mask:"99[9].99",
        "onincomplete": function(){ jQuery(this).attr('value','').val('')}
    });
    //per riposizionamento dei campi
    jQuery('.sortable:not(".ui-sortable")').sortable({item: '.duplicable'});
};
jQuery(function() {
    initializeFormLib();
});

基本上，我是在这个类的基础上添加.addClass('masked')和not选择器，这样函数就不会再应用到已经存在的字段上了。