停止表单刷新提交页面答案

【问题标题】：Stop form from refreshing the page on submit停止表单刷新提交页面
【发布时间】：2015-08-30 10:13:34
【问题描述】：

好的，所以我的页面上有一个基本表单：

        <form action='' id='formId' method='POST'>
        <table>
            <tr>
                <td>
                    <input type='text' name='Chat' autocomplete='off'>
                </td>
                <td>
                    <input type='submit' name='Go'>
                </td>
            </tr>
        </table>
    </form>

而 javascript 是：

        <script type='text/javascript'>
        $( "#formId" ).submit(function( event ) {
          event.preventDefault();
                <?php

                    $Chat = mysql_real_escape_string(strip_tags($_POST['Chat']));
                    $Go = mysql_real_escape_string($_POST['Go']);

                    if ($Go) {

                        if ($Chat) {

                            mysql_query("INSERT INTO `Chat` (`Chat`)
                            VALUES('$Chat')");
                        }

                    }

                ?>
        });
    </script>

我只需要它在有人提交时停止刷新。我在这里阅读了几篇关于同样问题的不同帖子，但似乎没有一个对我有用。

【问题讨论】：

您是否知道 PHP 在服务器上执行，在 HTML/JavaScript 被发送到客户端？ IE。此处的 PHP 代码在调用事件处理程序之前执行。见stackoverflow.com/q/13840429/218196。为清楚起见，您应该将 PHP 放在文件的顶部，而不是“任意”放在 HTML / JS 中。
不，不知道！目前我对 JS 还不是很了解，还有很多东西要学。
这与 JavaScript 的关系不大，而更多地与 Web 的工作方式有关。查看我评论中的链接。

标签： javascript html submit refresh page-refresh

【解决方案1】：

$('#formId').submit(function () {
 /do your stuff

 return false;
});

返回 false 将阻止页面重新加载。

【讨论】：

似乎仍然无法正常工作。使用 ajax 从它提交到的数据库中列出信息是否重要？

【解决方案2】：

您需要将 php 代码与您的脚本分开。 PHP在服务器端执行，js/jquery在客户端执行。如果对您有帮助，请尝试此代码。

<?php

    if(isset($_POST['Go'])){

        $Chat = mysql_real_escape_string(strip_tags($_POST['Chat']));
        $Go = mysql_real_escape_string($_POST['Go']);

        if ($Go) {

            if ($Chat) {

                mysql_query("INSERT INTO `Chat` (`Chat`)
                VALUES('$Chat')");
            }

        }
    }

?>


<form action='' id='formId' method='POST'>
    <table>
        <tr>
            <td>
                <input type='text' name='Chat' autocomplete='off'>
            </td>
            <td>
                <input type='submit' name='Go'>
            </td>
        </tr>
    </table>
</form>

 <script type='text/javascript'>
    $( "#formId" ).submit(function( event ) {
      event.preventDefault();
    });
</script>

修订时间：2015 年 6 月 15 日上午 10:16 GMT+8 您需要使用 AJAX 来发送数据。首先，在文本字段中添加一个 id，然后创建一个 php 文件以从 URL 获取数据并将聊天插入 DB。试试这个代码：

<form action='' id='formId' method='POST'>
    <table>
        <tr>
            <td>
                <input type='text' id='chat' name='Chat' autocomplete='off'>
            </td>
            <td>
                <input type='submit' name='Go'>
            </td>
        </tr>
    </table>
</form>


<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
 <script type='text/javascript'>
    $( "#formId" ).submit(function( event ) {
      event.preventDefault();

      $.ajax({
                    type: "POST",
                    url: "insert_chat.php?",
                    data: "Chat="+$('input#chat').val(),
                    dataType: "json",
                    success: function(data){
                    }
                });
    });
</script>

insert_chat.php

<?php

    $Chat = mysql_real_escape_string(strip_tags($_GET['Chat']));
    $Go = mysql_real_escape_string($_GET['Go']);

    if ($Go) {

        if ($Chat) {

            mysql_query("INSERT INTO `Chat` (`Chat`)
            VALUES('$Chat')");
        }

    }

?>

【讨论】：

嗯，它还在刷新页面。它位于silverpanthergames.com/friendsplus/Chat.php。一切似乎都正确，不知道为什么它不起作用。
啊。对不起。你的目标是一步刷新。我将修改我的代码，然后再试一次。