Question

function getEblockRow() {
    let eBlockRow = ($('<div/>', {
        'class': 'row'
    }));
    console.log(eBlockRow);
    return eBlockRow;
}

function getEblock() {
    let eBlock = ($('<div/>', {
        'class': 'col-md-3'
    }));
    return eBlock;
}

我如何附加：

$(function () {
    $(getEblock().appendTo(getEblockRow()));
    $(getEblock().append(getTextArea(), submitButton())).appendTo('#form');
});

我的控制台显示我确实有一行，但是以某种方式将按钮和texarea放在彼此的下面，我几乎没有CSS，所以我在那里不能做错什么。我错过了什么？

Answer 1

Working codepen 。

问题出在您将div彼此附加的方式上，请检查：

function getEblockRow() {
    let eBlockRow = ($('<div/>', {
        'class': 'row'
    }));
    console.log(eBlockRow);
    return eBlockRow;
}

function getEblock() {
    let eBlock = ($('<div/>', {
        'class': 'col-md-3'
    }));
    return eBlock;
}

$(function () {
    var container = getEblockRow();
    var block = getEblock().append('<textarea></textarea>', '<button class="btn">Submit</button>')

    container.append(block);
    container.append(block.clone(true));
    container.append(block.clone(true));

    $('#form').append(container);
});

我有一排，但是我的按钮和文本区域以某种方式彼此对齐，而不是彼此对齐

1 个答案: