Question

正如标题所说，我在javascript和表单提交方面遇到了问题。

我的问题是，我有一个html页面，带有一个表单（完全是模态，但我认为这并不重要）。当我提交表格时，我需要做的是

打开一个新页面，必须加载一百页（约100 - 300）的PDF格式。
验证表格。

问题是，在验证过程中，如果未加载pdf，表单所在的页面会被卡住或非常慢。一旦pdf加载到另一页上，主页就可以了。你怎么解释这个，我该怎么做才能避免这个问题呢？也许首先验证表单然后加载页面？

我不是一个javascript专家，对正在发生的事情的准确解释将是完美的。谢谢。

这是一段没有真实链接的代码

<form id="myForm" action="someURL" method="POST">
 <input type="hidden" value="someValue" name="someName">
<a class="button" id="myButton" href ="URL_OF_THE_PDF" target="_blank" >

JS代码：

$("#mybutton").on('click', function(){
   $.ajax({
    type: "POST",
    url: myURLForm,
    data: form.serialize()
    });
});

我放了一些示例代码，我尝试了不同的东西，但没有一个可行。

Answer 1

您可以在此处使用真实的HTML按钮，因为您不需要href。

<button id="myButton" type="button">

这可行：

按钮的onClick功能在新窗口中打开一个空白页面。然后它首先发送ajax请求。

完成后，它会在新窗口中加载pdf文件，该窗口在之前很久就打开了。

$("#myButton").on('click', function() {
   let myWindow = window.open(empty.html, '_blank');
    $.ajax({
        type: "POST",
        url: myURLForm,
        data: form.serialize()
    }).done(function() {
          myWindow.localtion = URL_OF_THE_PDF;
    });
});

请参阅：http://api.jquery.com/jquery.ajax/

你有100-300页的pdf文件有多大？

我认为浏览器非常忙于加载pdf文件，因为100-300页听起来非常大。所以你最好先做一个ajax请求，然后在ajax请求完成后加载pdf文件。

表单提交后，主页面卡住而pdf未在新页面上加载

1 个答案: