Question

我有一个问题，我使用jQuery从PHP脚本获取数据，但是数据会立即消失，因为我只能假设页面因某种原因而令人耳目一新。

我如何返回“Hello world”并将其保留在页面上？

我的HTML / JS代码：

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){

    $( "#target" ).submit(function( event ) {
        var usr = $("#username").val();
        var pass = $("#password").val();
        $.post("script.php", {username: usr, password: pass}, function(result){
            $("#result").html(result);
        });
    });

});

</script>
</head>
<body>

<p>Start typing a name in the input field below:</p>
First name:

<form id="target">
    <input id="username" type="text" value="User">
    <input id="password" type="text" value="pass">
    <input type="submit" value="Go">
</div>

<span id="result"></span>

</body>
</html>

PHP代码：

<?php

echo "Hello World";

?>

Answer 1

您使用$（＆＃34; #target＆＃34;）.submit（）提交表单，因此您需要使用event.preventDefault（）;

来防止这种情况发生

$( "#target" ).submit(function( event ) {

        event.preventDefault(); // add this line

        var usr = $("#username").val();
        var pass = $("#password").val();
        $.post("script.php", {username: usr, password: pass}, function(result){
            $("#result").html(result);
        });
    });

PHP和jQuery页面刷新问题

1 个答案: