php - 点击表单上的更改内容按钮

Question

我有一个联系表格供人们填写，如果他们想联系我。一个 php 页面执行将内容发送到我的电子邮件地址的操作。

2个问题：

1. 我希望确认按钮的内容更改为：“MESSAGE SEND！” 当有人点击按钮时。但我希望它在 3 秒后恢复到原始状态。

2. 当您单击按钮时，它会在我的浏览器中加载 php 页面！那不是我想要的。我只希望按钮向我发送电子邮件，而不是转到另一个页面。

希望你能帮忙！

Answer 1

尝试这个

1.

<input type="button" onclick="showLoad()" id="send" name="send" value="SEND"/>
<script>
function showLoad() {
document.getElementById('send').value="MESSAGE SEND!";
setTimeout(swap, 3000);
}
function swap() {
document.getElementById('send').value="SEND";
}
</script>

2.

<form action="" method="post">
......
......
/*your html code*/
<input type="button" onclick="showLoad()" id="send" name="send" value="SEND"/>
</form>
<?php 
if(isset($_post['send']))
{
/*your mail function*/
}
?>

Answer 2

对于您的第 1 个问题，您需要 JavaScript 来更改按钮行为，对于您的第 2 个问题，只需从执行操作的 PHP 脚本中进行标头重定向

Answer 3

首先，您将不得不使用 Javascript 和 AJAX。为什么不使用 Jquery 之类的 javascript 库呢？

假设您要使用它，代码如下所示。

HTML：

<form id="yourForm">
    <label for="name">Name</label>
    <input id="name" name="name" type="text" />
    <input class="submitBtn" type="submit" value="OK"/>
</form>

Javascript：

$(document).ready(function(){
    $('#yourForm').submit(function(event){
        $('.submitBtn').attr('value','MESSAGE SEND');

        setTimeout(function(){
            $('.submitBtn').attr('value','OK');
        }, 3000);

        var stuff = $('#yourForm').serialize();

        jQuery.ajax({
            type: 'POST',
            url: 'your_php_code.php', 
            data:{
                'stuff':stuff,                
            }
            ,success: function( response ){
                alert('OK');
            }
        });

        //Prevents form submission
        return false;        
    });
});

PHP

<?php
    parse_str($_POST['stuff']);
    mail("youremail@gmail.com", "subject", $name);
?>