提交时停止刷新表单

Question

我遇到了表单在提交时刷新的问题，我不希望它刷新，但我确实希望它提交。你们有谁知道我能做什么？

单击此link 可查看有关此的较早帖子。

<form method="post" id="radioForm">

<?
foreach($result as $radio):

    printf('

        <button type="submit"
            href="#radio"
            name="submitRadio"
            value="'.$radio['id'].'">
            Go!
        </button>

    ');
endforeach;
?>

</form>
<script type="text/javascript">
    $('#radioForm').submit(function(event) {
        event.preventDefault();
    $.ajax({
        url:'index.php',
        data:{submitRadio:[radiovalue]},
        type:'POST',
        success:function(response) {
            /* write your code for what happens when the form submit */
        });
    });
</script>
</div>

Answer 1

使用 submit() 处理程序并将按钮的值传递给其他脚本

首先在表单上设置id。

<form method="post" id="formId">

然后绑定一个监听器

$( "#formId" ).submit(function( event ) {
  event.preventDefault();
  //This is where you put code to take the value of the radio button and pass it to your player.
});

要使用它，您需要 jQuery。

您可以在此处阅读有关此处理程序的更多信息：http://api.jquery.com/submit/

Answer 2

这是 HTML <form> 在提交时的默认行为，它将浏览器 POST 数据发送到 action 属性中指定的目标位置，并将该处理的结果加载给用户。

如果您想在后台提交表单和POST 值而不重新加载页面，则必须禁用默认行为（表单提交）并使用AJAX。这种功能很容易在各种 JavaScript 库中使用，例如一个名为 jQuery 的常见库。

这里是 jQuery 的 AJAX 功能的文档http://api.jquery.com/jquery.ajax/

互联网上有很多教程可以向您介绍 jQuery 的基本使用（将库包含到您的 HTML 页面中）以及如何通过 AJAX 提交表单。

您将需要创建一个 PHP 文件，该文件可以获取由于 AJAX 请求而发布的值（例如将值提交到数据库）。该文件将需要返回可以在您的代码中提取的值，以便您知道请求是否不成功/成功。返回的值通常采用JSON 格式。

这个答案中有很多关键词可以引导您发现 AJAX。我希望这会有所帮助！

Answer 3

像 jquery 这样使用 ajax

$('form').submit(function(event) {
 event.preventDefault();
$.ajax({
    url:'index.php',
    data:{submitRadio:[radiovalue]},
    type:'POST',
    success:function(response) {
        /* write your code for what happens when the form submit */
    }
  });
});