使用 jQuery 创建两个 HTML 元素并将一个嵌套在另一个元素中

Question

我正在尝试编写一个脚本，通过简单地将选项传递给不同的函数来生成 Twitter Bootstrap 样式的元素。在本例中，我正在生成一个提交按钮。

jQuery 似乎允许渲染一个元素，但像这样嵌套它们却失败了。

这种方法有什么替代品吗？

function renderButton(buttonText, buttonType, buttonName){
    if(buttonType == 'submit'){
        var $button = $('<input/>', {
            'type'  : 'submit',
            'name'  : buttonName,
            'value' : buttonText,
            'class' : 'btn submit'
        });
    }
    var $form_actions = $('<div/>', {
        'class' : 'form-actions',
        'text'  : $button
    });

    return $form_actions;   
};

renderButton('Go!', 'submit', 'buttonGo').insertAfter('#a');

Answer 1

到你在这里的时候：

var $form_actions = $('<div/>', {
    'class' : 'form-actions',
    'text'  : $button
});

return $form_actions;  

$button 包含一个 jQuery 元素（不仅仅是一堆 HTML）。直接将其分配为text 是行不通的，但您可以像这样附加它：

var $form_actions = $('<div/>', {
    'class' : 'form-actions'
});

$form_actions.append($button);

return $form_actions;