使用 html、jquery 和 php 消失的注销按钮答案

【问题标题】：Disappearing logout button with html, jquery, and php使用 html、jquery 和 php 消失的注销按钮
【发布时间】：2013-02-10 17:00:28
【问题描述】：

我是一个非常环保的程序员，在网络上的任何地方都找不到我的问题的答案。感谢您向我发送的任何帮助！我正在尝试为允许上传并允许用户注销的用户创建一个基本的登录页面。在登录期间，我开始一个会话。有用。对于上传和注销，我使用 jquery.form.js 库来利用表单功能。对于我的代码的上传部分，一切正常。用户可以上传任何类型的图片，按钮在上传过程中被禁用，然后在成功后重新激活以进行新的上传。但是，对于注销部分，在单击注销按钮并销毁会话后，注销按钮就消失了。我认为这可能与会话销毁有关，但即使在我的 php 中没有它，按钮也消失了。我按照 html、js 和 php 的顺序在下面复制了我的代码的注销部分。有任何想法吗？谢谢！

<html>
    <head>
        <title>Sample</title>
        <meta http-equiv= "Content-Type" content="text/html; charset=UTF-8">
            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
            <script type = "text/javascript" src = "js/jquery.form.js"></script>    
            <script type = "text/javascript" src = "js/xmlRequest.js"></script>
            <script>xmlRequest = new xmlRequest();</script>
            <script type = "text/javascript" src = "js/fileUpload.js"></script>
            <script>fileUpload = new fileUpload();</script>
    </head>
    <body>
        <div id = 'userLogout'>
            <form action="php/logout.php" id = "logoutSection" enctype = "multipart/form-data" method = "post" >
                <button type="submit" id="logoutButton">Close!</button>
            </form>
        </div>

        <div id = 'logOutOutput'>
        </div>
    </body>
</html>



function fileUpload()
{   
$(document).ready(function()
    {   
        $('#logoutSection').on('submit',function(a){

                //prevent default action of going to new page.
                a.preventDefault();
                $('#logoutButton').attr('disabled','');
                $(this).ajaxSubmit({
                    target: '#userLogout',
                    success: afterLogout//output a thank you message
                });
                $('#loginForm').show();
                $('#logOutOutput').append("<br>Thanks for checking us out!<br>");
            });
    });

    function afterLogout()
    {
        $('#logoutSection').resetForm();
        $('#logoutButton').removeAttr('disabled');
    }
}


<?php
    echo "<br>Goner<br>";
    session_start();//always required for sessions
    session_destroy();//logs out
?>

【问题讨论】：

标签： php jquery logout

【解决方案1】：

我相信虽然我不确定登录后按钮消失的原因是因为您使用ajaxSubmit 选项target 设置为#userLogout 指向表单的父div .

ajaxSubmit 成功后会将<div id='userLogout'> ... </div> 的内容替换为ajax 操作的结果。

我会这样： <div id='output'></div> <div id = 'userLogout'> <form action="php/logout.php" id = "logoutSection" enctype = "multipart/form-data" method = "post" > <button type="submit" id="logoutButton">Close!</button> </form> </div>

并将 ajaxSubmit 目标更改为 target: 'output'

阅读本文 http://www.justwebdevelopment.com/blog/ajaxform-and-ajaxsubmit-options/ 目标标识页面中要使用服务器响应更新的元素。该值可以指定为 jQuery 选择字符串、jQuery 对象或 DOM 元素。默认值：空

【讨论】：

谢谢！！！！！！！！！！！！！我不敢相信我错过了这个。在上传部分，我更改了与上传 div 不同的目标。在注销部分，我正在替换所有内容。我刚刚尝试了你的建议，它奏效了。非常感谢的人！