Question

我使用表单将信息发送到php页面。（使用＆＃39; GET＆＃39;）我希望表单下方有两个按钮：一个用于预览生成的页面，另一个用于下载生成的页面。

我找到了预览部分的解决方案：

<script type="text/javascript">
$("form").submit(function() {
$("form").attr('target', '_blank');
return true;
});
</script>

哪个效果很好。

要使生成的页面可供下载，我通常使用普通的提交按钮：

<input type="submit" name="submit" id="submit" onClick="myFunction()" value="Download Bonus Page" >

在生成的php页面上，我在最顶层添加了

<?php
$filename = 'bonuspage.html';
header('Content-disposition: attachment; filename=' . $filename);
header('Content-type: text/html');
// ... the rest of your file
?>

我想知道如何将两种功能结合起来，因为当我点击任一按钮时，它始终是打开的预览 - 我无法让下载工作......

Answer 1

您需要发送一个额外的参数action并检查您的PHP处理程序文件（<form action=中引用的文件）中的2个不同的值（例如，＆＃39; download＆＃39;＆amp; ＆＃39;预览＆＃39）。

给出以下HTML：

<form method="GET" action="your/handler.php" id="myform">
    <input type="hidden" name="action" id="action" value="preview" />
    <input type="button" value="preview" id="preview"/>
    <input type="button" value="download" id="download"/>
</form>

您可以轻松创建切换功能并手动提交表单。

function toggleAction(e) { 
   var target = $(e.target);
   $('#action').val(target.attr('value'));
   $('#myform').submit();
}
$('#preview').on('click', toggleAction);
$('#download').on('click', toggleAction);

或者如果你想避免需要重新加载页面（使用这种方法，不需要额外的隐藏字段）：

function toggleAction(e) { 
   var target = $(e.target);
   $.ajax({ url: 'your/handler.php', data: { action: target.attr('value') })
    .done(function(data) {
       // process returned data (from echo statement in handler)
    });       
}

在您的PHP文件中：

<?php if($_GET['action'] === 'preview') {
    // preview code
} else {
    // download code
} ?>

Answer 2

按下这样的两个按钮：

<script type="text/javascript">
    function myFunction(el) {
        $(el).parents('form').first().attr('target','_blank').find('input[name="what"]').val('download');
    }
</script>

<form method="GET">
    <input type="hidden" name="what" value="preview" />
    <input type="submit" value="Preview" />
    <input type="button" value="Download" onclick="myFunction(this)" />
</form>

这样，您将获得一个名为what的附加变量，指示按下了哪个按钮。

在你的PHP文件中，只需：

<?php
$filename = '/complete/path/of/the/file.html';
if($_GET['what'] === 'preview') {
    //
} else {
    header('Content-disposition: attachment; filename=' . basename($filename));
    header('Content-type: text/html');
}

echo file_get_contents($filename);

?>

还有另一种方法，有两个提交按钮，名称和值不同，您可以在PHP脚本中测试，但仍需要使用Javascript进行target="_blank"下载。

更好的方法是使用HTML5 <a download>语法。检查this link。

使用两个提交按钮区分HTML表单上的提交按钮

2 个答案: