如何提交表单并保持在同一页面上

How to submit form and remain on the same page

本文关键字：一页 何提交 提交 表单      更新时间：2023-09-26

有一个类似的问题演示了如何在jQuery中做到这一点。不幸的是，我正在使用原型并且翻译代码不是很直接。

提交表单并留在同一页面?

需要发生的是值(email)被发布到子域上的页面，而用户没有被重定向。我没有任何控件来编辑子域上的页面。

任何帮助都将是感激的。

function submitEmailForm(){
        var userEmail = $('Text').value;
        $('EmailForm').action = 'http://subDomain.myDomain.com/?email_address='+userEmail;
        $('EmailForm').request({ onComplete: function(){ return false;} });
    }
<form method="post" id="EmailForm" onsubmit="submitMobileEmailForm(); return false;">
          <input type="text" id="Text"/>
          <input type="submit" id="Submit" value=""/>
</form>

您可以使用AJAX模拟表单提交。

(注意:我使用了一个老项目作为模板，所以我使用的一些技术可能有点老。例如，事件处理的工作方式可能不同。)

function ajaxFormSubmission(form)
{
    xhrThingy = yourFunctionForObtainingXMLHttpRequestInstance();// XHR support is different for various browsers, so you might need to have browser specific code.
    xhrThingy.onreadystatechange = eventHandlerHere;
    xhrThingy.open('POST', 'theFileThatWillHandleYourRequest.php', true);// The used arguments are: HTTP request Method, request url, asynchronous flag
    xhrThingy.setRequestHeader("Content-type", "application/x-www-form-urlencoded");// Simulating Form Submission

    var emailData = form.elements['Text'].value;// Extracting needed data from form
    var postData = "emailAddress=" + emailData;
    xhrThingy.send(postData);
}

eventHandlerHere函数可以检查响应。像这样:

function eventHandlerHere()
{
    if (xhrThingy.readyState==4 && xhrThingy.status==200)
    {
        var response = xhrThingy.responseText
        // Do whatever you need to do with the email adress
    }
}

在我所从事的项目中，我使用了一种嵌套方法进行快速原型设计，所以你的具体实现看起来会有所不同。例如，我引用了xhrThingy，它只是在作用域中，因为函数嵌套在ajaxFormSubmission函数中。

你需要通过JQuery在同一页面上重定向它。

http://www.webdeveloper.com/forum/archive/index.php/t - 105181. - html

相关文章：