Question

在我的网页下面，CalcModule.func2（）函数中的一些代码将错误消息写入id = errorbox的div元素。我的问题是，当我将此div元素放在表单（myForm）上方时，当CalcModule.func2（）函数写入错误消息时，整个页面将被删除。只有当我将div errorbox元素放在表单下面时（参见代码），页面才会被删除。

我哪里出错了？

<head>
    <title></title>

    <script>
        function CalcModule(){};
        //some vars
        CalcModule.var_a;
        CalcModule.var_b;
        //etc.

        //some functions
        CalcModule.func1 = function(msg){ 
        }

        CalcModule.func2 = function(){
            if(!selected){ //no checkbox selected?
                $("#errorbox").removeClass("success");
                $("#errorbox").addClass("error");
                $("#errorbox").html("errormessage");
             }
             else{
                $("#errorbox").removeClass("error");
                $("#errorbox").html("");
             }
        }
        //etc.

        $(document).ready(function(){
            $("#myForm").validate({})

            $.get("process.php", //ajax call
                function(msg) {
                    var form = Getform(msg);
                    $("#wrapper").append(form);
                }
            )

        }//$(document).ready(function

    </script>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
    <!-- ideally the '<div id="errorbox"><div>' should be at this location, but that does not work-->
    <form id="myForm" name="myForm" action="" method="post" autocomplete="on">
        <!--some table html code here-->
        <div id="wrapper"></div> <!--anchor point for adding set of form fields -->        
        <input type="submit" name="submitForm" value="Submit Form">
    </form>
    <div id="errorbox"><div> <!--this seems the only location for this div on the page where the page is not erased-->
</body>

Answer 1

必须是： <div id="errorbox"></div>

使用DIV结束标记！否则，浏览器会在关闭父级TAG之前自动关闭它，这会使html（）方法替换所有父级内容。

Answer 2

试试这个而不是.html（）

$("#errorbox").empty();
$("#errorbox").append("Error Message");

jquery html（）删除webcontent

2 个答案: