当我对 mail.php 使用 AJAX load() 时,此 php 文件中的 Javascript 代码会发生什么情况?

问题描述 投票:0回答:0

load()
方法从服务器加载数据并将返回的数据放入 进入所选元素。

我对这部分代码有点困惑:

$(".form-message").load("mail.php",...

我在 mail.php 中有 PHP 和 Javascript 代码。两种代码都处理错误。

查看

<p class="form-message"></p>
元素,PHP 代码对该元素有意义,因为它会根据用户的输入更改内容。

但是对于 Javascript 代码,没有任何与

<p class="form-message"></p>
元素相关的内容来操纵它的内容。

所以我想知道,如果我将这样的 PHP 文件加载到

<p>
元素:

$(".form-message").load("mail.php, ...

...它包含与那个无关的 Javascript 代码

<p> element
,那 JS 代码会发生什么?

它会像普通的 Javascript 代码一样执行吗?

index.php

<script>
        $ (document) .ready (function() {
            $("form") .submit(function(event) {
                    event.preventDefault();
                var name = $("#mail-name").val();
                var email = $("#mail-email").val();
                var gender = $("#mail-gender").val();
                var message = $("#mail-message").val();
                var submit = $(“"#mail-submit").val();
                $(".form-message").load("mail.php", {
                    name: name;
                    email: email,
                    gender: gender,
                    message: message,
                    submit: submit

                });

            });
        });
    </script>
</head>

<body>

<form action="mail.php" method="POST")>
    <input id="mail-name" type="text" name="name" placeholder="Full name">
    <br>
    <input id="mail-email" type="text" name="email" placeholder="E-mail">
    <br>
    <select id="mail-gender" name="gender">
        <option value="male">Male</option>
        <option value="female">Female</option>
    </select>
    <br>
    <textarea id="mail-message" name="message" placeholder="Message"></textarea>
    <br>
    <button id="mail-submit" type="submit" name="submit">Send e-mail</button>
    <p class="form-message"></p>
</form>


</body>

mail.php

<?php

if (isset($_POST['submit'])) {
    $name = $_POST[ 'name'];
    $email= $_POST['email'];
    $gender = $_POST[ 'gender'];
    $message = $_POST[ 'message'];

    $errorEmpty = false;
    $errorEmail = false;

if (empty($name) || empty($email) || empty ($message)) {
    echo "<span class='form-error'>Fill in all fields!</span>";
    $errorEmpty = true;
}

elseif (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
    echo "<span class='form-error'>Write a valid e-mail address!</span>";
    $errorEmail = true;
}
else {
    echo "<span class='form-success'>Fill in all fields!</span>";
    }
} 
else {
    echo "There was an error!";
}
?>

<script>
    $("#mail-name, #mail-email, #mail-message, #mail-gender").removeClass("input-error");

    var errorEmpty = "<?php echo $errorEmpty; 2>";

    var errorEmail = "<?php echo $errorEmail; 2>";

    if (errorEmpty == true) {
        $("#mail-name, #mail-email, #mail-message").addClass("input-error");
    }
    if (errorEmail == true) {
        $("#mail-email").addClass("input-error");

    }
    if (errorEmpty == false && errorMail == false) {
        $("#mail-name, #mail-email, #mail-message").val("");
    }

</script>

我在这个Youtube AJAX 教程上找到了这段代码

javascript jquery ajax
© www.soinside.com 2019 - 2024. All rights reserved.