JavaScript隐藏HTML表单的提交按钮，直到从另一个输入提交
JavaScript隐藏HTML表单的提交按钮，直到从另一个输入提交
提问于 2018-07-21 04:40:14
我能够让表单的一个输入从隐藏变为提交，但不能进行第二次尝试。因此，我相信我在球场上。
<?php include("rssUploadFile_code.php"); ?>
<section class="article_centered">
<h2>RSS File Upload</h2>
<form action="" method="post" enctype="multipart/form-data">
<label for="fileToUpload">Upload RSS file:</label>
<input type='file' name='fileToUpload' id='fileToUpload' /><br />
<input type="hidden" name="openFile" id="openFile" value="Open File" /><br />
<textarea name="displayFile" rows="6" cols="60" readonly="readonly">
<?php echo $fileText; ?></textarea><br />
<input type="text" value="<?php echo $my_rssFile; ?>" /><br />
<input type="hidden" name="submitFile" id="submitFile" value="Submit File" />
</form>
<script>
document.getElementById('fileToUpload').onchange = function() {
document.getElementById('openFile').setAttribute('type', 'submit');
};
document.getElementById('openFile').onsubmit = function() {
document.getElementById('submitFile').setAttribute('type', 'submit');
};
</script>
</section>使用fileToUpload onchange时，'openFile‘输入将从隐藏变为提交。问题是我在'submitFile‘输入上遗漏了什么？
我读过类似的帖子，这就是我的一些代码来源。如果您需要更多代码，请让我知道。这个RSS编码有几个文件。谢谢你的帮助。
回答 3
Stack Overflow用户
回答已采纳
发布于 2018-07-21 05:08:23
请原谅我的英语。
问题是一个表单只能有一个提交按钮。
您不应该将openFile按钮设置为作为按钮提交并使用onclick事件。
请看下面的代码，我检查过了，它工作正常
<section class="article_centered">
<h2>RSS File Upload</h2>
<form action="" method="post" enctype="multipart/form-data">
<label for="fileToUpload">Upload RSS file:</label>
<input type='file' name='fileToUpload' id='fileToUpload' /><br />
<input type="hidden" name="openFile" id="openFile" value="Open File" /><br />
<textarea name="displayFile" rows="6" cols="60" readonly="readonly">
Text</textarea><br />
<input type="text" value="Rss File" /><br />
<input type="hidden" style="" name="submitFile" id="submitFile" value="Submit File" />
</form>
<script>
document.getElementById('fileToUpload').onchange = function() {
document.getElementById('openFile').setAttribute('type', 'button');
};
document.getElementById('openFile').onclick = function() {
document.getElementById('submitFile').setAttribute('type', 'submit');
};
</script>
</section>很抱歉我的解释很糟糕。
Stack Overflow用户
发布于 2018-07-21 04:54:07
使用hidden将输入设置为type="button，然后触发单击。
<section class="article_centered">
<h2>RSS File Upload</h2>
<form action="" method="post" enctype="multipart/form-data">
<label for="fileToUpload">Upload RSS file:</label>
<input type='file' name='fileToUpload' id='fileToUpload' /><br />
<input type="hidden" name="openFile" id="openFile" value="Open File" /><br />
<textarea name="displayFile" rows="6" cols="60" readonly="readonly">
<?php echo $fileText; ?></textarea><br />
<input type="text" value="<?php echo $my_rssFile; ?>" /><br />
<input type="button" name="submitFile" id="submitFile" value="Submit File" hidden/>
</form>
<script>
document.getElementById('fileToUpload').onchange = function() {
document.getElementById('openFile').setAttribute('type', 'submit');
};
document.getElementById('openFile').onsubmit = function() {
document.getElementById('submitFile').click();
};
</script>
</section>Stack Overflow用户
发布于 2018-07-21 05:07:27
由于submit实际上只是为<form>保留的，所以您可以使用.onclick。
(function() {
document.getElementById('fileToUpload').onchange = function() {
document.getElementById('openFile').setAttribute('type', 'submit');
};
document.getElementById('openFile').onclick = function() {
document.getElementById('submitFile').setAttribute('type', 'submit');
};
})();<input type='file' name='fileToUpload' id='fileToUpload' /><br />
<input type="hidden" name="openFile" id="openFile" value="Open File" /><br />
<textarea name="displayFile" rows="6" cols="60" readonly="readonly">
<?php echo $fileText; ?></textarea><br />
<input type="text" value="<?php echo $my_rssFile; ?>" /><br />
<input type="hidden" name="submitFile" id="submitFile" value="Submit File" />
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51450069
复制相关文章
相似问题