search

Home >Backend Development >PHP Tutorial >javascript - HTML点击图片出现选择文件框并能够提交表单进行验证

javascript - HTML点击图片出现选择文件框并能够提交表单进行验证

WBOY
WBOYOriginal
2016-06-06 20:34:131142browse

今天 看了大神写的代码 能够出现选择文件框 但是选择之后怎么提交表单来进行验证呢？

代码如下 ：

<code><script type="text/javascript">
    function F_Open_dialog() 
   { 
        document.getElementById("btn_file").click(); 
   } 

</script>

<div>

    <input type="file" id="btn_file" style="display:none">
    <img  src="images/default.gif" onclick="F_Open_dialog()" alt="javascript - HTML点击图片出现选择文件框并能够提交表单进行验证" >

</div>
</code>

回复内容：

今天 看了大神写的代码 能够出现选择文件框 但是选择之后怎么提交表单来进行验证呢？

代码如下 ：

<code><script type="text/javascript">
    function F_Open_dialog() 
   { 
        document.getElementById("btn_file").click(); 
   } 

</script>

<div>

    <input type="file" id="btn_file" style="display:none">
    <img  src="images/default.gif" onclick="F_Open_dialog()" alt="javascript - HTML点击图片出现选择文件框并能够提交表单进行验证" >

</div>
</code>

监听 input file onchange 事件，触发 form submit 事件。

<code>var btnFile = document.getElementById("btn_file");
btnFile.onchange = function() {
    this.form.submit();
}
</code>
Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article：通过 vagrant 在 ubuntu 环境下安装 discuz X3 系列成功，但静态文件路径错误Next article：使用lamp一键包升级后apache挂了

Related articles

See more