HTML 提交POST表单后,在新窗口中显示结果 |
您所在的位置:网站首页 › js接收form表单返回结果 › HTML 提交POST表单后,在新窗口中显示结果 |
HTML 提交POST表单后,在新窗口中显示结果
在本文中,我们将介绍在HTML中如何提交POST表单,并在新窗口中显示返回结果的方法。 阅读更多:HTML 教程 1. HTML表单基础HTML表单用于收集用户输入的数据,并将其发送到服务器进行处理。在提交表单时,有两种常用的方法:GET和POST。 GET方法会将表单数据附加到URL的末尾,以查询字符串的形式发送到服务器。这种方法适用于简单的数据传递,但不适用于敏感数据,因为数据会暴露在URL中。 POST方法会将表单数据作为HTTP请求的主体发送到服务器。这种方法适用于需要传递敏感数据的情况,因为数据不会暴露在URL中。 2. 在新窗口中打开表单结果在某些情况下,我们可能希望在提交表单后,将结果显示在一个新的浏览器窗口或选项卡中,而不是在当前窗口中加载结果。为了实现这个目标,我们可以使用JavaScript的window.open()方法。 function openNewWindow() { var form = document.getElementById("myForm"); var url = form.getAttribute("action"); var method = form.getAttribute("method"); var data = new FormData(form); var newWindow = window.open("", "_blank"); newWindow.document.write("Loading..."); var xhr = new XMLHttpRequest(); xhr.open(method, url); xhr.onload = function() { newWindow.document.open(); newWindow.document.write(xhr.responseText); newWindow.document.close(); }; xhr.onerror = function() { newWindow.document.open(); newWindow.document.write("Error"); newWindow.document.close(); }; xhr.send(data); }在上述示例中,我们使用了window.open("", "_blank")来打开一个新的空白窗口,并在其中显示结果。我们使用XMLHttpRequest对象发送POST请求,并在请求成功后将返回的数据写入新窗口的文档中。 请注意,这个方法只能在用户允许浏览器弹出新窗口时才有效。如果用户禁用了弹出窗口,将无法在新窗口中打开结果。 3. 使用target属性在新窗口中打开结果除了使用JavaScript来手动打开新窗口外,HTML表单还提供了一个更简单的解决方案。我们可以使用target属性指定在哪个窗口中打开表单结果。 在上述示例中,我们使用了target="_blank"来在新窗口中打开表单结果。这样,当用户提交表单时,结果将在新窗口中加载。 总结在本文中,我们介绍了如何在HTML中提交POST表单,并在新窗口中显示返回结果的方法。我们可以使用JavaScript的window.open()方法手动控制新窗口的打开,或者使用HTML表单的target属性来指定在新窗口中打开结果。无论选择哪种方式,都可以灵活地实现在新窗口中显示表单结果的需求。 |
今日新闻 |
点击排行 |
|
推荐新闻 |
图片新闻 |
|
专题文章 |
CopyRight 2018-2019 实验室设备网 版权所有 win10的实时保护怎么永久关闭 |