用Javascript清空(重置)文件类型的INPUT元素的值

最新推荐文章于 2022-08-04 14:19:57 发布

原创最新推荐文章于 2022-08-04 14:19:57 发布 · 337 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #ViewUI

WEB前端同时被 2 个专栏收录

64 篇文章

订阅专栏

javascript

57 篇文章

订阅专栏

本文介绍了一种在不同浏览器中清除HTML文件输入框值的方法，包括IE5到IE11及最新版本的Chrome、Firefox和Opera等。通过JavaScript实现了一个按钮点击事件，当点击时清除文件输入框的内容。

转自：http://www.html5cn.org/article-6547-1.html

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Bin</title>
  
</head>
<body>
  <form>
    <input type="file">
    <button type="button">clear</button>
  </form>
  <script type="text/javascript">
  var es = document.forms[0].elements;
es[1].onclick = function(){
  clearInputFile(es[0]);
};

    function clearInputFile(f){
        if(f.value){
            try{
                f.value = ''; //for IE11, latest Chrome/Firefox/Opera...
            }catch(err){
            }
            if(f.value){ //for IE5 ~ IE10
                var form = document.createElement('form'), ref = f.nextSibling;
                form.appendChild(f);
                form.reset();
                ref.parentNode.insertBefore(f,ref);
            }
        }
    }
  </script>
</body>
</html>

测试过，可以用