时间戳

首页 > 解决方案 > php中错误输入警报后如何避免页面刷新

javascript - php中错误输入警报后如何避免页面刷新

问题描述

<!DOCTYPE html>
<html lang="en-US">
    <head>
        <title>Captcha Implementation</title>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
    </head>
    
    <body>
        <div class="container" style="width: 600px">
            <br/>
            <br/>
            <div class="panel panel-default">
                <div class="panel-body">
                    <div id="message"></div>
                    <h4 align="center">Submit the word you see below:</h4>
                    <p id="captImg" align="center">
                        <img src="image.php" id="captcha_image"/>
                    </p>
                    <!-- <p align="center">Can't read the image? click <a href="javascript:void(0);" class="refreshCaptcha">here</a> to refresh.</p> -->
                    <form action="index.php" method="post" id="captch_form" name="captch_form">
                        <div class="form-group">
                            <label>Enter the Captcha</label>
                            <input type="text" name="captcha_word" id="captcha_word" class="form-control" placeholder="" value="" autocomplete="off"/>
                            <div id="message" align="center" class='text-danger'></div>
                        </div>
                        
                        <div class="form-group">
                            <label>Contact Number</label>
                            <input type="text" name="contact_number" id="contact_number" class="form-control" value="" autocomplete="off"/>
                            
                        </div>
                        
                        <div class="form-group" align="center">
                            <input type="submit" name="submit" id="submit" class="btn btn-info" value="SUBMIT" onclick="captcha_submit()"/>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </body>
</html>

<script>
    function captcha_submit()
    {
        var Data = $("#captch_form").serializeArray();
        console.log(Data); 
        $.ajax(
            {
                url : "action.php?name=captcha_save",
                type: "POST",
                data : Data,
                success:function(data)
                {
                    $('#message').html(data);
                }
            });
            $("#message").slideDown("slow");
            e.preventDefault(); 
    }
</script>

<?php
    $host = "localhost";
    $database = "pmcrb_ambabajaj";
    $user = "root";
    $password= "";
    $db = $database;
    
    $con = mysqli_connect($host,$user,$password,$db);
    
    $Action = @$_GET['name'];
    
    if($Action == 'captcha_save')
    {
        $captcha_word = @$_POST['captcha_word'];
        $contact_number = @$_POST['contact_number'];
        $created_date = time();
        
        if($captcha_word == '')
        {?>
            <div class="alert alert-danger alert-dismissible">
                <a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a>
                Please Enter Captcha.
            </div>
        <?php }
        /*else if($captcha_word == $_SESSION['captcha_code'])
        {?>
            <div class="alert alert-danger alert-dismissible" role="alert">
                <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <strong style="color:#fff;text-align:center;font-size:14px;font-family:Times New Roman, Times, serif;margin-left:50px;">Warning!</strong> Invalid Captcha Code
            </div>
        <?php }*/
        else if($contact_number == '')
        {?>
            <div class="alert alert-danger alert-dismissible" role="alert">
                <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <strong style="color:#fff;text-align:center;font-size:14px;font-family:Times New Roman, Times, serif;margin-left:50px;">Warning!</strong> Please Enter Contact Number
            </div>
        <?php }
        else
        {
            $sql = "insert into pm1captcha(`created_date`,`contact_number`,`captcha_word`)values('$created_date','$contact_number','$captcha_word')";
            $qry = mysqli_query($con,$sql);
            ?>
            <div class="alert alert-success alert-dismissible" role="alert">
                <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <strong style="color:#fff;text-align:center;font-size:14px;font-family:Times New Roman, Times, serif;margin-left:50px;">Success!</strong> Data Saved Successfully
            </div>
        <?php }
        
    }
?>

我已经编写了一些代码来将验证码详细信息保存到数据库表中，数据保存正确，但如果该字段为空，则每次页面都会刷新。如何避免每次在 php.ini 中出现警报后页面刷新。谁能帮帮我吗。这里我在 index.php 页面中编写了 html 代码，而 php 代码在 action.php 页面中编写

标签： javascriptphphtmlsqlajax

解决方案

推荐阅读