在消息发送后清除表单输入

Clear form input after message has been sent

本文关键字：清除 表单 输入 消息      更新时间：2023-09-26

我试图在发送表单后清除表单消息输入字段。尽管它在数据有机会被发送之前清除数据。下面是我的代码:

<script>
    $(function () {
        $('form#SendForm').on('submit', function (e) {
            $.post('sendmessagefriend.php', $(this).serialize(), function (data) {
                // This is executed when the call to mail.php was succesful.
                // 'data' contains the response from the request
            }).error(function () {
                // This is executed when the call to mail.php failed.
            });
            e.preventDefault();
        });
    });
</script>
<script>
    $('#SendForm').on('click', function () {
        $('#SendForm').find('input:text').val('');
        $('input:checkbox').removeAttr('checked');
    });
</script>

形式:

<form id="SendForm" class="SendMsg" role="form" method="post" action="sendmessagefriend.php">
 <input type="text" id="s_firstname" name="s_firstname" class="MsgInputHidden" value="<?= $_SESSION["user"]["firstname"] ?>" />
 <input type="text" id="s_lastname" name="s_lastname" class="MsgInputHidden" value="<?= $_SESSION["user"]["lastname"] ?>" />
 <input type="text" id="sender" name="sender" class="MsgInputHidden" value="<?= $_SESSION["user"]["id"] ?>" />
 <input type="text" id="r_firstname" name="r_firstname" class="MsgInputHidden"value="<?= $FriendName->firstname ?>" />
 <input type="text" id="r_lastname" name="r_lastname" class="MsgInputHidden"value="<?= $FriendName->lastname ?>" />
 <input type="text" id="recipient" name="recipient" class="MsgInputHidden" value="<?= $FriendName->id ?>" />
 <input type="text" id="ip" name="ip" class="MsgInputHidden" value="<?= $_SERVER["REMOTE_ADDR"] ?>" />
 <input type="text" id="date" name="date" class="MsgInputHidden" value="<?= date('Y-m-d') ."'n" ?>" />
 <?php $now = time(); $utc_time = $now - intval(date('Z', $now)); ?>
  <input type="text" id="time" name="time" class="MsgInputHidden" value="<?= '' . date('H:i:s', $now) . '' ?>" />
  <input id="message" type="text" name="message" style="width: 100%; overflow: scroll;">
  <input id="submit" class="submit" type="submit" name="submit" value="Submit" />
</form>

用这个

代替点击处理程序
$('#SendForm').find('input:text').val(''); 
$('input:checkbox').removeAttr('checked');

中的成功回调，如

$('form#SendForm').on('submit', function(e) {
        $.post('sendmessagefriend.php', $(this).serialize(), function (data) {
            // This is executed when the call to mail.php was succesful.
            // 'data' contains the response from the request
            $('#message').val(''); 
        })
        .error(function() {
            // This is executed when the call to mail.php failed.
        });
        e.preventDefault();
    });

如果您不关心请求是否成功，只想清除输入，请将其放在ajax调用之后，如

$('form#SendForm').on('submit', function(e) {
            $.post('sendmessagefriend.php', $(this).serialize(), function (data) {
                // This is executed when the call to mail.php was succesful.
                // 'data' contains the response from the request
            })
            .error(function() {
                // This is executed when the call to mail.php failed.
            });
            $('#message').val('');  
            e.preventDefault();
        });
相关文章：