如何防止在单击提交按钮时刷新页面 - How to prevent from page refresh on submit button click

How to prevent from page refresh on submit button click

我有一个输入和一个提交按钮的表单。

<form method='POST' action='' enctype='multipart/form-data' id="form_search">
<input type='hidden' name="action" id="form_1" value='1' />
</span><input id="query" type="text" name="mol" value="">
<input type='submit' value='Search' name="Search" id="Search" />

在表单提交表单时，输入数据转到下面的代码 PHP

if (isset($_POST['Search'])) {
$_SESSION["query"] = $_POST["mol"];
$_SESSION["action"] = $_POST["action"];
}

我想避免在提交表单时刷新页面。我尝试了 e.preventDefault（）并返回 false;我的 Java 脚本中的方法但不起作用（此方法帮助我刷新页面，但不允许我将数据发送到 PHP 代码）

请

帮助我解决这个问题，请建议使用Ajax代码来解决这个问题。

页面刷新将删除您以前的数据，因此要保留它，您可以使用 $.post（）或 $.ajax（）

您可以通过在事件处理程序函数中添加以下两项之一来阻止页面刷新

对于纯 js

 return false;

对于 jQuery，您可以使用

e.preventDefault(); // e is passed to handler

您的完整代码将类似于

在 js 中使用 $.post（）

function checkfunction(obj){
$.post("your_url.php",$(obj).serialize(),function(data){
 alert("success");
 });
 return false;
 }

.html

<input type='submit' onclick="return checkfunction(this)" />

或与提交时相同的效果

<form  onsubmit="return checkfunction(this)" method="post">

如果没有 ajax，你可以简单地在 PHP 中添加 checked 属性。因此，例如，如果您的单选组具有名称radio，并且一个具有值a，则另一个b：

<?php
$a_checked = $_POST['radio'] === 'a';
$b_checked = $_POST['radio'] === 'b';
?>
<input type="radio" name="radio" value="a"<?=($a_checked ? ' checked' : '')?>></input>
<input type="radio" name="radio" value="b"<?=($b_checked ? ' checked' : '')?>></input>

因此，当用户提交表单并再次显示它时，即使页面刷新，也会像用户提交了表单一样。

<input type="radio" name="rbutton" id="r1">R1
<input type="radio" name="rbutton" id="r2">R2
<input type="button" id="go" value="SUBMIT" />
<div id="result"></div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('#go').click(function(){
        var val1 = $('input:radio[name=rbutton]:checked').val();
        var datastring = "partialName="+val1;
        $.ajax({
            url: "search.php",
            type: "POST",
            data: datastring,
            success: function(data)
            {
                $("#result").html(data);
            }
        });
    });
});
</script>