Question

基本上我正在验证表单，我正在收集错误消息，我将它们附加到动态生成的div。现在我无法将这些消息附加到这个div上。这就是我做过的事情

//generates a div onclick of submit button
$("body").append("<div class='overlay'><div class='errorContainer'>.html(errorMsg)</div><div>`<a href='javascript:void(0);' class='cross'>X</a><div></div>");

.html(errorMsg)这导致错误/不正确

function closeErrorBox() {
            var errorMsg = "";
                var ferrorMsg =  "Please say your first name" + "<br>";
                var aerrorMsg = "Please type address" + "<br>";
                var eerrorMsg = "Please type a valid email Address" + "<br>"
                if($("#name").val() == "") {
                    errorMsg += ferrorMsg;
                }
                if($("#address").val() == "") {
                    errorMsg += aerrorMsg;
                }
                if($("#email").val() == "") {
                    errorMsg += eerrorMsg;
                }

                $(".errorContainer").html(errorMsg);


                $(".overlay").remove();
                }

Answer 1

.errorContainer div位于.overlay div内。在函数末尾删除overlay时，也会删除errorContainer。除此之外，似乎.html(errorMsg)工作正常（如果它仍然导致错误，请说明出现了什么问题）。

重新阅读你的问题，我无法理解你的程序流程：你是否已经知道错误时添加了div，并在单击“X”时关闭它？如果是这样，我建议做这样的事情：

var errorMsg = "";
var ferrorMsg =  "Please say your first name" + "<br>";
var aerrorMsg = "Please type address" + "<br>";
var eerrorMsg = "Please type a valid email Address" + "<br>"
if($("#name").val() == "") {
    errorMsg += ferrorMsg;
}
if($("#address").val() == "") {
    errorMsg += aerrorMsg;
}
if($("#email").val() == "") {
    errorMsg += eerrorMsg;
}

// Adapting Diego's answer:
$("<div class='overlay'><div class='errorContainer'></div><div><a href='javascript:void(0);' class='cross'>X</a><div></div>")
    .appendTo($("body"))
    .find(".errorContainer")
        .html(errorMsg)
        .end()
    .find(".cross")
        .click(function(e) {
            e.preventDefault();
            $(this).closest(".overlay").remove();
        });

Answer 2

我认为你的意思是：

//generates a div onclick of submit button
$("body").append("<div class='overlay'><div class='errorContainer'></div><div><a href='javascript:void(0);' class='cross'>X</a><div></div>").find(".errorContainer").html(errorMsg);

如何向动态生成的div添加动态内容？

2 个答案: