Question

我正在尝试使用jquery支持创建一个文件html，检查一些cookie。如果存在cookie，则填写表格并提交（一切都在加载！）。如果不存在cookie，则会显示登录表单。

所以我正在尝试开发的是一个页面，其中包含用于首次访问的登录表单以及用于“重定向”到另一个域上的另一个页面的其他访问。

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>mylocalpage</title>
        <script src="http://code.jquery.com/jquery-latest.js"></script>
            <script src="http://mysite.com/jquery-cookie.js"></script>
            $(document).ready(function(){
                var ag = $.cookie("agenc");
                var op = $.cookie("oper");
                var pa = $.cookie("pass");
                if(ag==null || op==null || pa==null){
                    var loginBox = $('#login-box');
                    $(loginBox).fadeIn(300);
                    var popMargTop = ($(loginBox).height() + 24) / 2; 
                    var popMargLeft = ($(loginBox).width() + 24) / 2; 

                    $(loginBox).css({ 
                        'margin-top' : -popMargTop,
                        'margin-left' : -popMargLeft
                    });
                    $('body').append('<div id="mask"></div>');
                    $('#mask').fadeIn(300);
                }else{
                    $('#txtAgency_ext').val(ag);
                    $('#txtUsername_ext').val(op);
                    $('#txtPassword_ext').val(pa);
                    $('#form').submit();
                }
            });
            function saveData(){
                var ag = $('#txtAgency_ext').val(), op = $('#txtUsername_ext').val(), pa = $('#txtPassword_ext').val();
                if(ag.length>0 && op.length>0 && pa.length>0){
                    $.cookie("agenc",ag,{ expires: 365,path:"/" });
                    $.cookie("oper",op,{ expires: 365,path:"/" });
                    $.cookie("pass",pa,{ expires: 365,path:"/" });
                    $('#form').submit();
                }else{
                    alert('All field required!');
                }
            }
        </script>
    </head>
    <body>
        <style>
            #mask {
    display: none;
    background: #000; 
    position: fixed; left: 0; top: 0; 
    z-index: 10;
    width: 100%; height: 100%;
    opacity: 0.8;
    z-index: 999;
}

.login-popup{
    display:none;
    background: #333;
    padding: 10px;  
    border: 2px solid #ddd;
    float: left;
    font-size: 1.2em;
    position: fixed;
    top: 50%; left: 50%;
    z-index: 99999;
    box-shadow: 0px 0px 20px #999;
    -moz-box-shadow: 0px 0px 20px #999; /* Firefox */
    -webkit-box-shadow: 0px 0px 20px #999; /* Safari, Chrome */
    border-radius:3px 3px 3px 3px;
    -moz-border-radius: 3px; /* Firefox */
    -webkit-border-radius: 3px; /* Safari, Chrome */
}

img.btn_close {
    float: right; 
    margin: -28px -28px 0 0;
}

fieldset { 
    border:none; 
}

form.signin .textbox label { 
    display:block; 
    padding-bottom:7px; 
}

form.signin .textbox span { 
    display:block;
}

form.signin p, form.signin span { 
    color:#999; 
    font-size:11px; 
    line-height:18px;
} 

form.signin .textbox input { 
    background:#666666; 
    border-bottom:1px solid #333;
    border-left:1px solid #000;
    border-right:1px solid #333;
    border-top:1px solid #000;
    color:#fff; 
    border-radius: 3px 3px 3px 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    font:13px Arial, Helvetica, sans-serif;
    padding:6px 6px 4px;
    width:200px;
}
        </style>
        <div id="login-box" class="login-popup">
            <form method="post" id="form" name="login" action="http://a.page.com">
                <label>
                    <span>Agency</span>
                    <input id="txtAgency_ext" name="txtAgency_ext" value="" type="text">
                </label>

                <label>
                    <span>Operator</span>
                    <input id="txtUsername_ext" name="txtUsername_ext" value="" type="text">
                </label>

                <label>
                    <span>Password</span>
                    <input id="txtPassword_ext" name="txtPassword_ext" value="" type="password">
                </label>
          </form>
          <button class="button" onclick="saveData()">Save and submit!</button>
        </div>
    </body>
</html>

我的问题是，当提交表单时，页面会被重定向到她自己，所以它会无限时间提交 - >重定向 - >提交 - >重定向等... 我怎么解决？谢谢！

编辑：发生了什么：

http://jsfiddle.net/x96qV/

Answer 1

让我们检查一下您应用的流程。

用户点击“提交”按钮，该按钮设置Cookie并提交表单。页面重新加载。
页面加载并检查cookie。它们存在，因此执行else语句。这包括提交表单的行$('#form').submit();。页面重新加载。
无限期地重复步骤2。

因此，您需要删除$('#form').submit();行，以阻止表单无限期提交。

如何创建html文件来做自动发帖请求

1 个答案: