javascript - 提交表单时页面刷新重定向到另一个页面

Question

我最近使用这个脚本将我的网络应用程序项目转换为单页应用程序:

function AjaxLoadJQuery(pageToLoad){
        var requestObject = new XMLHttpRequest();
        requestObject.onreadystatechange = function()
        {
            if (requestObject.readyState == 4 && requestObject.status == 200)
            {
                document.open();
                document.write(requestObject.responseText);
                document.close();
            }
            if (requestObject.readyState == 4 && requestObject.status == 404)
            {
                alert('belaj');
            }
        };
        requestObject.open("GET", pageToLoad, true);
        requestObject.send();
    }

我是这样使用的(例如):

<li ><a class="djelatnost" onclick="AjaxLoadJQuery('/servis/Struktura/ostalo.html')">NAŠE USLUGE</a></li>

我将我希望加载的页面的 url 传递给它。

现在我已经建立了一个这样的联系表:

<div id="contact_container" class="container">
        <?php include('C:/wamp/www/servis/Skripte/serverSideValidation.php'); ?>
        <div id="contact_div">
            <form id="contact_form" name="inputForm" method="post" class="formElements">
                Vaše ime<br>
                <input type="text" name="Name" id="cf_name"><span id="nameError"><?php if($_SERVER['REQUEST_METHOD'] == 'POST'){ echo "IMA NESTO JBG"; if(validateName($_POST['Name'])) echo "TESTTEST"; } ?></span><br>
                Vaša e - mail adresa<br>
                <input type="text" id="cf_email" name="Email"><span id="emailError"></span><br>
                Vaša opština<br>
                <input type="text" name="Opstina" id="cf_opstina"><br>
                Vaš grad<br>
                <input type="text" name="Grad" id="cf_grad"><br>
                Vaš broj telefona<br>
                <input type="text" id="cf_brojtel" name="Brojtel"><span id="telefonError"></span><br>
                Predmet poruke<br>
                <select name="Predmet" id="cf_predmet" onchange="setToValueFromCmbBox()">
                    <option value="Ponuda">Ponuda</option>
                    <option value="Kupovina">Kupovina</option>
                    <option value="Pohvala">Pohvala</option>
                    <option value="Zalba">Žalba</option>
                </select><span id="predmetError"></span><br>
                Tip komitenta<br>
                <input name="Tip" type="text" id="cf_tip" disabled><span id="tipError"></span><br>
                Poruka<br>
                <textarea name="Poruka" id="cf_message" >
                </textarea><span id="porukaError"></span><br>
                <input type="submit" id="submitButton" name="submitButton" value="Pošalji" onclick="validateInput();">
            </form>
        </div>
    </div>

如您所见，我在输入元素附近使用了一些跨度来指示服务器端验证后的最终错误(我在客户端使用 setCustomValidity())。

问题是当我按下提交按钮时(javascript 关闭，所以我可以测试 .php)，页面重新加载并转到地址栏中的页面(这是索引页面)，这意味着一切都变了。

我想在提交后保持在同一页面上，同时保留上面使用的脚本(对于单页应用程序)。

Answer 1

我实际上只是设置了一个直接指向同一页面的 Action ，现在它可以正常工作了。