javascript - 未捕获的类型错误 : elem. 替换不是函数

Question

这是我正在尝试做的事情: for loop inside the append is not working

这里是我的代码:

$('body').append(
    $('<section>').append(
        $('<form>')
        .attr('class', "ac-custom ac-checkbox ac-cross")
        .attr('autocomplete', "off")
        .append(
            $('<h2>')
            .html(
                "Your to do list to uniquely deploy cross-unit s:"
            ),

            function() {
                options = ["ONE", "TWO", "THREE", "FOUR"];
                var $container = $('<ol></ol>');
                $.each(options, function(val) {
                    $container.append($('<li>').append(
                        $("<input>").attr('id', "cb" +
                            val)
                        .attr('name', "cb" + val)
                        .attr('type', "checkbox"),
                        $("<label>").attr('for', "cb" +
                            val).append(
                            $('<span>').html(
                                "Quickly incentivize impactful actions"
                            )
                        )
                    ));
                })
                return $('<ol>').html();
            }

        )
    )
)

错误:

jquery-2.1.1.js:5089 Uncaught TypeError: elem.replace is not a function

我做错了什么？

Answer 1

假设您只想附加 h2 中的 HTML 和您传递给 append 的函数的输出，您可以将调用链接起来:

$('body').append(
    $('<section>').append(
        $('<form>')
        .attr('class', "ac-custom ac-checkbox ac-cross")
        .attr('autocomplete', "off")
        .append(
            $('<h2>')
            .html(
                "Your to do list to uniquely deploy cross-unit s:"
            )
        )
        .append(
            function() {
                options = ["ONE", "TWO", "THREE", "FOUR"];
                var $container = $('<ol></ol>');
                $.each(options, function(val) {
                    $container.append($('<li>').append(
                        $("<input>").attr('id', "cb" +
                            val)
                        .attr('name', "cb" + val)
                        .attr('type', "checkbox"),
                        $("<label>").attr('for', "cb" +
                            val).append(
                            $('<span>').html(
                                "Quickly incentivize impactful actions"
                            )
                        )
                    ));
                })
                return $container.html();
            }

        )
    )
)

但难怪您看不到问题所在。你应该把它分成更小、更易于管理的部分