Question

我需要为学校建立一个单页网站。

在此网站中，我必须包含基本联系表（姓名，电子邮件）。

输入的信息应由php处理。

由于它是单页程序，因此我不想在重新加载整个页面时提交联系表格。

我宁愿像alertbox那样做类似JS的事情，但是要使用输入的信息，例如：

“您好（姓名）！我们将尽快通过电子邮件发送到您的地址（电子邮件）与您联系。”

有可能这样做吗？

Answer 1

不需要php，可以使用js

$(document).ready(function() {
  $(document).on("click", "#btnSubmit", function(e) {
    e.preventDefault();
    var username = $('#username').val();
    var email = $('#femail').val();
    if (username && email) {
      alert("Hello (" + username + ")! We will be contacting you soon by email to your address (" + email + ").");
    }
  });
});

<!-- Jquery is javascript library to ease and reduce tedious work in pure JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form action="#" method="post">
  <input type="text" name="username" id="username">
  <input type="email" name="femail" id="femail">
  <input type="submit" name="btnSubmit" id="btnSubmit" value="Submit">
</form>

jQuery官方Doc。

有关如何使用Jquery处理点击事件的点击处理程序link。

Answer 2

最简单方式：

<?php
     echo "<script>alert(" . $msg . ")</script>";
?>

Answer 3

如果您绝对需要使用PHP，只需对PHP API进行简单的Ajax调用。在那里收集发布的数据，检查名称和电子邮件是否同时存在，并将它们组合为JSON编码对象。然后只需返回JSON数据即可。但是在这种情况下，您实际上并不需要PHP。

$(document).ready(function() {
  $(document).on("click", "#btnSubmit", function(e) {
    e.preventDefault();
    var username = $('#username').val();
    var email = $('#femail').val();

     $.ajax({

        url : 'link to php script',
        type : 'POST',
        data: { nameData: username, emailData: email},
        dataType:'json',
        success : function(data) {              
            alert('Hello '+data.name+'! We will be contacting you soon by email to your address ' + data.mail);
        },
        error : function(request,error)
        {
            alert("Request: "+JSON.stringify(request));
        }
    });

  });
});

Answer 4

您可以创建一个html表单，然后使用ajax将数据传递到您的php脚本。

<html>
<body>
    <input type="text" id="name">
    <input type="email" id="email">
    <button id="submit">SUBMIT</button>
</body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
    $("#submit").click(function() {
        var name = $("#name").val();
        var email = $("#email").val();
        $.ajax({ 
            url: "process.php", 
            method: "POST", 
            data: { name : name, email : email}, 
            success: function(res) {
                if (res == 1) {
                    alert("Hello "+name+"! We will be contacting you soon by email to your address "+email+".");
                }
            } 
        });
    });
</script>
</html>

然后在您的php脚本中处理这些值，如果数据处理成功，则回显1。

process.php

<?php
    $name = $_POST['name'];
    $email = $_POST['email'];
    // process your data
    // if processed successfully
        echo 1;
?>

带有PHP的Javascript Alertbox

4 个答案: