php - 使用 PHP+Jquery 隐藏和显示 div 时遇到问题

标签 php javascript jquery ajax

用户提交他们的电子邮件地址,检查电子邮件是否有效且不在数据库中。

我遇到的问题是,一旦表单提交成功,我就无法隐藏表单并显示感谢 div。目前,它用“谢谢!”替换了电子邮件文本框。我不想要的文本。

必须更改或添加哪些内容才能隐藏表单(在通过错误/验证检查后)并显示感谢 div?

谢谢!!

Index.php

<?php

require "includes/connect.php";

$msg = '';

if($_POST['email']){

    // Requested with AJAX:
    $ajax = ($_SERVER['HTTP_X_REQUESTED_WITH']  == 'XMLHttpRequest');

    try{
        if(!filter_input(INPUT_POST,'email',FILTER_VALIDATE_EMAIL)){
            throw new Exception('Invalid Email!');
        }

        $mysqli->query("INSERT INTO coming_soon_emails
                        SET email='".$mysqli->real_escape_string($_POST['email'])."'");

        if($mysqli->affected_rows != 1){
            throw new Exception('You are already on the notification list.');
        }

        if($ajax){
            die('{"status":1}');
        }

        $msg = "Thank you!";

    }
    catch (Exception $e){

        if($ajax){
            die(json_encode(array('error'=>$e->getMessage())));
        }

        $msg = $e->getMessage();        
    }
}
?>


<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Notify me test</title>

<link rel="stylesheet" type="text/css" href="css/styles.css" />

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script src="js/script.js"></script>

</head>

<body>

<div id="launch">

    <h1>Notify</h1>

    <h2>Notify me</h2>

    <form id="form" method="post" action="">
        <input type="text" id="email" name="email" value="<?php echo $msg?>" />
        <input type="submit" value="Submit" id="submitButton" />
    </form>

    <div style="display:none" id="thankyou">
    Thank you!
    </div>


</div>

</body>
</html>

script.js

$(document).ready(function(){

    // Binding event listeners for the form on document ready

    $('#email').defaultText('Enter your Email Address');

    // 'working' prevents multiple submissions
    var working = false;

    $('#page form').submit(function(){

        if(working){
            return false;
        }
        working = true;

        $.post("./index.php",{email:$('#email').val()},function(r){
            if(r.error){
                $('#email').val(r.error);
            }
            else $('#email').val('Thank you!');

            working = false;
        },'json');

        return false;
    });
});

// A custom jQuery method for placeholder text:

$.fn.defaultText = function(value){

    var element = this.eq(0);
    element.data('defaultText',value);

    element.focus(function(){
        if(element.val() == value){
            element.val('').removeClass('defaultText');
        }
    }).blur(function(){
        if(element.val() == '' || element.val() == value){
            element.addClass('defaultText').val(value);
        }
    });

    return element.blur();
}

最佳答案

如果您不想用感谢文本替换输入,为什么要这样做?

else $('#email').val('Thank you!');

相反, 其他{ $("#form").hide(); $("#thankyou").show(); }

关于php - 使用 PHP+Jquery 隐藏和显示 div 时遇到问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5299819/

相关文章:

javascript - SilverStripe 前端 Ajax 博客文章使用 'read more' 按钮加载

javascript - 请搜索 TreeView 帮助

php - 如何正确提取get变量

php - 在 Jquery 中需要一个 "SEE MORE"风格的侧边栏菜单

PHP脚本根据用户权限动态显示目录中的文件?

javascript - 在 keydown 上使用 jquery 跳过 tr 选择

javascript - 从输入值更新自定义属性显示未定义

php - 如何让 fopen 正确超时?

javascript - 如何在 Bootstrap 网站中添加 Logo /客户端 slider

javascript - 使用 Javascript 数组和循环在页面上以十六进制显示所有 216 种网络安全颜色