Php 使用.ajax提交和显示数据，但css不'；直到页面真正刷新后才生效

我使用jquery的.ajax函数将数据发送到数据库表，并在页面上显示数据，而无需刷新页面

在显示db表内容的查询中，每个条目都封装在名为.wrap的div类中

该类的底边距为30像素。当我使用我的表单时，新添加的数据显示出来，css不会显示出来。页边距不存在，但手动刷新页面时，css会生效。有什么问题吗？下面是我的代码

$(function() {
    $('#form').submit(function(e) {

        var data = $(this).serialize();

        // Stop the form actually posting
        e.preventDefault();

        // Send the request
        $.ajax({
            type: "POST",
            url: "submit.php",
            data: data,
            cache: false,
            beforeSend: function() {
                var error = '';

                if (!$.trim($("#cat").val())) {
                    error = "<p>the cat field is empty</p>";
                }

                if (!$.trim($("#box").val())) {
                    error += "<p>the box field is empty</p>";
                }

                if (error) {
                  $(".fb-error").html(error);
                  $(".fb-error").css( "display", "block" );
                  xhr.abort();
                }                       

                },
            success: function(html){
                 $(".fb-error").css( "display", "none" );
                $('textarea#box').val('');
                $("#box-wrap").prepend(html);
            }
        });
    });
});

只要改变这个

$("#box-wrap").prepend(html);

…为了这个

$("#box-wrap").prepend('<div class="wrap">' + html + '</div>');

$（“#包装盒”）.prepend（“”+html+“”）；

---

它应该工作得很好（假设您的AJAX总是只返回一行要添加，否则，您需要在服务器端进行相同的更改，或者对结果进行更复杂的解析）。

在AJAX调用后，输出HTML可能不是您所期望的。刷新时，HTML的生成方式不同。使用浏览器的检查器找出哪些CSS规则正在应用（哪些没有应用）。这可能是大海捞针式的问题。我建议打开这两个版本的页面，并使用开发人员工具检查元素，以找出区别。一旦你知道它是什么，你就可以找出如何修复它。我知道区别是什么。提交表单并显示内容后，新添加的内容周围不存在.wrap类。但是当我刷新.wrap类时，@gregor jQuery在这里是不相关的。您需要修改服务器端代码以返回

第4行

，而不仅仅是

第4行

。@gregor只需发布AJAX调用的完整响应。如果问题是由

前置程序引起的，那是因为您传递的内容存在问题，而这是来自您的服务器。这违背了我的全部目的，是不需要执行的额外步骤。确实需要执行。AJAX/JQuery无法知道您想要对它返回的数据做什么，除非您告诉它。您的AJAX调用似乎只是返回值“row4”，而没有周围的HTML标记。。。因此，这就是它为“#box wrap”元素准备的内容。要围绕该值的HTML标记需要由AJAX调用调用的页面添加，或者由值前面的代码添加。
<div class="wrap">row 4</div>
<div class="wrap">row 3</div>
<div class="wrap">row 2</div>
<div class="wrap">row 1</div>

foreach ($query as $row) {
        echo '<div class="wrap">' . $row["box"] . '</div>';
    }

include 'connect.php';

$string = strip_tags($_POST["box"]);

$stmt = $dbh->prepare("INSERT INTO boxes (box) VALUES (:box)");

$stmt->execute(array(
":box" => $string
));

$("#box-wrap").prepend(html);

$("#box-wrap").prepend('<div class="wrap">' + html + '</div>');