Question

所以我在尝试通过Ajax提交表单时刷新数据库的条目。条目在div中。

这是为了仅刷新div而尝试的代码。但它不起作用。

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
    $(document).ready(function(){
        $(function () {

            $('form').on('submit', function (e) {

                e.preventDefault();
                $.ajax({
                    type: 'post',
                    url: '<?php if(isset($id)){echo "update.php";} else {echo "create.php";}?>',
                    data: $('form').serialize(),
                    success: function () {
                        $(entries).fadeOut(800, function(){
                            entries.html(msg).fadeIn().delay(2000);

                        });
                    }
                });

            });

        });
    });
</script>

这是我要重新加载的div：

<div class="container" id="entries">
<div class="row">
    <div class="col pb-3">
        <h2>Einträge</h2>
    </div>
</div>
<?php
require_once('./read.php');

if ($result->num_rows > 0) {
    // output data of each row
    while($row = $result->fetch_assoc()) { ?>
        <div class="row mb-3">
            <div class="col">
                <form>
                    <div class="form-row">
                        <div class="col">
                            <input type="text" class="form-control" name="name" placeholder="Name" value="<?php echo $row["name"] ?>" disabled>
                        </div>
                        <div class="col-1">
                            <a href="recipe.php?ID=<?php echo $row["ID"] ?>" class="btn btn-warning">Ansehen</a>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    <?php }
} else { ?>
    <div class="row">
        <div class="col">
            <p>Keine Einträge in der Datenbank!</p>
        </div>
    </div>
<?php }
?>

有人可以帮我解决这个问题吗？

Answer 1

entries未定义...如果您要选择ID为entries的div，则需要使用"#entries"选择器，如下所示：

$('#entries').fadeOut(800, function(){
    $('#entries').html(msg).fadeIn();
});

delay()应该在fadeIn()之前，而不是在...之后......这意味着它会在fadeIn()之前等待2000毫秒...

$('#entries').fadeOut(800, function(){
    $('#entries').html(msg).delay(2000).fadeIn();
});

PS1。在我看来，没有必要拖延它。

PS2。我会改用fadeTo()零不透明度。所以它不会从视口中删除元素。

Answer 2

你需要得到＆＃34; msg＆＃34; ＆＃39;＃entries＆＃39;

的参数和更改选择器

success: function (msg) {
    $('#entries').fadeOut(800, function(){                
        $('#entries').html(msg).fadeIn().delay(2000);
    });
 }

尝试使用Ajax刷新Div不起作用

2 个答案: