javascript - 从操作表单调用 jQuery

Question

从 HTML 表单中，我调用 jQuery 方法，触发警报消息并使图像变得可见，但图像在一秒钟后消失？这是我的表格:

<form action= "jquery.php" method="post" > 
    <label for="farfar">Farfar:</label> <input type="text" placeholder="farfar" name="farfar"> 
    <input type="submit" value="Tilføj">
</form>

在文件 jquery.php 中，我有以下脚本:

$(document).ready(function(){
    $("form").submit(function(){
        alert("Submitted");
        $(".ff").show();
    });
});

我制作了一个 PHP 脚本:

<?php
    $farfar = $_POST['farfar'];
?>

图像是一个类(在脚本之外):

img class ="ff" src="human.png"...

在我的 CSS 文件中，我已设置图像的当前值。

img {
    display: none;
    position: relative;
}

现在，当我加载页面并为表单赋予值时，jQuery 将被正确调用，显示警报消息并显示图像。但只维持了1秒左右，就又消失了。我究竟做错了什么？以及如何使图像保留在屏幕上？

Answer 1

图像消失的原因是您的页面 POST 并更改了页面内容。我不确定您要将表单发布到哪个 URL，但您可以尝试将表单发布到自己，然后可能会起作用。或者您也可以使用 jQuery 通过异步方式 POST 表单，这样页面就不会加载。