试图隐藏“下载”按钮一旦点击

我有一个简单的表单只包含一个用于下载文件的按钮。这里是代码：试图隐藏“下载”按钮一旦点击

<form method='post' action='download.php?file=file.txt' name='form1'> 
<button type='submit'>Telecharger</button> 
</form>

的download.php是一个小的PHP文件与头文件用来搞下载，那就是：

<?php 
    $filename=$_GET['file']; 
    header('Content-Type: text/plain'); 
    header("Content-disposition: attachment;filename=$filename"); 
    readfile($filename); 
?>

我试图做的是隐藏的按钮或用户点击它后的表单。到目前为止，我已尝试用CSS和JavaScript侦听器玩弄，但迄今为止没有任何工作。

当我点击按钮下载文件，但不隐藏按钮。

如何在提交表单后隐藏按钮？

来源

2017-05-03 Joulin Nicolas

使用Javascript是最方便的。在按钮上添加一个“onclick”监听器，然后“隐藏”它。 – RepeaterCreeper

在'onclick'发生时通过执行'this.style.display ='hidden''来尝试。不起作用。 –

你正在做一个PHP提交。无论你做什么，它都不会隐藏你的按钮。该页面在php提交后重新加载。如果你想隐藏按钮，你将不得不发送阿贾克斯呼吁下载 – shazyriver

您可以使用JavaScript：

<form method='post' action='download.php?file=file.txt' name='form1'> 
    <button onClick='this.style.display = "none";' type='submit'>Telecharger</button> 
</form>

单击时这将隐藏您的按钮。 Here是一个小提琴。

来源

2017-05-03 13:56:50

......这样？

document.getElementById("downloader").addEventListener('click', function() { 
 
    this.style = "display: none;" 
 
});

<div> 
 
    <button type='submit' id="downloader">Telecharger</button> 
 
</div>

来源

2017-05-03 13:58:59 marmeladze

你应该至少是给你的按钮，像这样一类，

<button class="button-toggle" type='submit'>Telecharger</button>

，你可以用香草JS选择并隐藏它，

document.getElementByClassName("test").addEventListener("click", function(event) { 
    event.target.style.visibility = "hidden"; 
    }, false);

或者如果您使用的是jQuery

$('.button-toggle').click(function() { 
    $(this).hide(); 
});

应该让你关闭。

来源

2017-05-03 14:00:58

你应该改变你的下载方法。 Php提交重新加载页面，这就是为什么你使用的任何方法都不会起作用。试试这个我还没有测试过。但它应该工作。

<script> 
$('.download_button').click(function() { 
    $(this).hide(); 
}); 
</script> 
<a href="path_to_your_file" class="download_button" download>

来源

2017-05-03 14:06:42 shazyriver

已通过验证的答案适合我。由于我无法通过窗体标记之外的脚本来执行此操作，因此我一直在思考。为什么认为这有效？ –

因为这条线。 header（“Content-disposition：attachment; filename = $ filename”）;我在你的download.php中忽略了这一行，这意味着你的php页面不会显示，而是下载。所以不会发生重新加载。如果你从download.php中删除这行，它将停止工作。 – shazyriver

以下应该工作。

<form method='post' action="javascript:alert('Hello there, I am being submitted');" name='form1' id="form"> 
    <button type='submit' id="hide">Telecharger</button> 
</form> 

<script type="text/javascript"> 

var button = document.getElementById("hide"); 

button.addEventListener("click", function(event){ 
    button.style.display = "none"; 
}); 

</script>

我改变了表单的动作只是为了检查发生了什么，但你可以用你的动作路径替换它。

来源

2017-05-03 15:20:14 Darkisa

试图隐藏“下载”按钮一旦点击

回答

相关问题