Question

我使用以下HTML块来表示一个（隐藏）表单，其中包含我想要处理并打印到文件的感兴趣的数据，这些表单在激活时：

<form id="output_form" action="exportData.pl" method="POST" target="_blank" style="display:none;">
  <input type="text" id="output_form_data" name="output_data" style="">
  <input type="text" id="output_form_filename" name="output_filename" style="">
</form>

当我提交此表单时，数据会发送到exportData.pl，output_data会将output_filename数据打印到变量#!/usr/bin/perl use strict; use warnings; use CGI; my $val = param('output_data'); my $fn = param('output_filename'); print "Content-Type: text/plain\n"; print "Content-Disposition: attachment; filename=$fn\n"; print "Content-Description: File to download\n\n"; print "$val\r\n";中的指定文件名。

非常粗略：

<form id="output_form_1" action="exportData_1.pl" method="POST" target="_blank" style="display:none;">
  <input type="text" id="output_form_data_1" name="output_data" style="">
  <input type="text" id="output_form_filename_1" name="output_filename" style="">
</form>
<form id="output_form_2" action="exportData_2.pl" method="POST" target="_blank" style="display:none;">
  <input type="text" id="output_form_data_2" name="output_data" style="">
  <input type="text" id="output_form_filename_2" name="output_filename" style="">
</form>

我想要做的是在提交此表单时导出两个文件，而不仅仅是一个。将使用不同的脚本处理第二个文件，以便更改输出。

到目前为止我尝试过：

我设置了两种隐藏的形式：

ExportData()

当我点击一个按钮时，我使用jQuery来激活在两个表单上运行submit()的JavaScript函数function ExportData() { var rawTxt = document.getElementById("results_map").innerHTML; var fn_1 = exportFilename(".1.tsv"); $('#output_form_data_1').val(rawTxt); $('#output_form_filename_1').val(fn_1); $('#output_form_1').submit(); var fn_2 = exportFilename(".2.tsv"); $('#output_form_data_2').val(rawTxt); $('#output_form_filename_2').val(fn_2); $('#output_form_2').submit(); };：

submit()

但是，output_form_1仅在output_form_2表单上调用。第二种形式{{1}}没有任何反应。

如何提交两个隐藏的表单来打印两个不同的文件？如果做不到这一点，我将如何通过其他方式做到这一点？（注意，如果我使用客户端技巧，我不能使用Flash或Java，我需要能够支持IE用户。）

Answer 1

使用AJAX提交表单。在您的情况下，当第一个表单即将提交POST请求到exportData_1.pl启动并且当前页面上的代码执行停止时，会发生什么。

通过使用AJAX技术，可以在不离开页面的情况下发出2个单独的POST请求。

This solution解释了如何实现。

UPD ：很抱歉，有点专注于问题而忽略了您要在每个表单提交上下载文件的事实。使用javascript是不可能的（不是在所有浏览器中）。

在旧版IE浏览器中使用的替代方法是使用2个iframe，每个iframe包含一个表单：

<iframe src="firstFormPage.html"></iframe>
<iframe src="secondFormPage.html"></iframe>

demo

这种方法可以让您在iframe中提交表单，而不会导致主页重新加载。

UPD2 ：修改iframes中的表单字段：

<iframe id="form1" src="form1.html" frameborder="0"></iframe>
<iframe id="form2" src="form2.html" frameborder="0"></iframe><br/>
<input id="editForms" type="button" value="Edit Forms"/>

<script>
    $('#editForms').click(function(){
        $('#form1').contents().find('#input').val("Modifed in frame 1");
        $('#form2').contents().find('#input').val("Modifed in frame 2");
    });
</script>

demo

如何使HTML表单打印两个文件

1 个答案: