如何获取元素父级的值和ID并重用它来创建另一个元素?

时间:2016-12-07 20:45:37

标签: javascript jquery

我在输入字段上有一个事件监听器,它当前根据这些输入的值创建复选框,如下所示:

let firstNames = $("input").map(function() {
    return $(this).val();
});

$('.copyBoxes').remove();
checkboxInsert.before("<div class='copyBoxes'><p>Which registrant does this ticket belong to?</p></div>");
$(firstNames).each(function(index, fName){
        $('.copyBoxes').append($('<input />', { type: 'checkbox', id: fName, value: fName, class: 'copyBox', style: 'display:inline;' }));
        $('.copyBoxes').append($('<label />', { 'for': fName, text: fName, class: 'copyBox', style: 'display:inline;' }));
    });

我需要做的是拉取输入字段的父ID,并将其作为属性添加到新复选框。

1 个答案:

答案 0 :(得分:0)

使用.parent()获取元素的父级。

$('.copyBoxes').html('<p>Which registrant does this ticket belong to?</p>');
$("input").each(function() {
    var fName = $(this).val();
    var parentID = $(this).parent().attr('id');
    $('.copyBoxes').append($('<input />', { 
        type: 'checkbox', 
        id: fName, 
        value: fName, 
        'class': 'copyBox', 
        style: 'display:inline;', 
        data: { parent: parentID } 
    })).append($('<label />', { 
        'for': fName, 
        text: fName, 
        'class': 'copyBox', 
        style: 'display:inline;' 
    }));
});

顺便说一下,在将它用作对象属性时应引用class,因为它是某些Javascript实现(IE)中的保留字。