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

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

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
Freigeben: 2016-06-06 20:34:13
Original
1162 Leute haben es durchsucht

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

代码如下 :

<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="/static/imghw/default1.png" data-src="images/default.gif" class="lazy" onclick="F_Open_dialog()" alt="javascript - HTML点击图片出现选择文件框并能够提交表单进行验证" >

</div>
</code>
Nach dem Login kopieren
Nach dem Login kopieren

回复内容:

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

代码如下 :

<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="/static/imghw/default1.png" data-src="images/default.gif" class="lazy" onclick="F_Open_dialog()" alt="javascript - HTML点击图片出现选择文件框并能够提交表单进行验证" >

</div>
</code>
Nach dem Login kopieren
Nach dem Login kopieren

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

<code>var btnFile = document.getElementById("btn_file");
btnFile.onchange = function() {
    this.form.submit();
}
</code>
Nach dem Login kopieren
Verwandte Etiketten:
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage