代码之家  ›  专栏  ›  技术社区  ›  gurun8

jQuery对输入type=“file”更改方法

  •  65
  • gurun8  · 技术社区  · 14 年前

    我试图用jQuery的简单而优雅的API百分之百地接受它,但是我遇到了API和直接的HTML之间的不一致,我不太清楚。

    我有一个AJAX文件上传器脚本(功能正常),每次文件输入值更改时都要运行该脚本。这是我的工作代码:

    <input type="file" size="45" name="imageFile" id="imageFile" onchange="uploadFile()">
    

    当我转换 onchange jQuery实现的事件:

    $('#imageFile').change(function(){ uploadFile(); });
    

    结果不一样。与 属性 uploadFile() .change() 事件处理程序,仅在值第一次更改时激发事件。之后的任何值更改都将被忽略。这在我看来是错误的,但这肯定不是jQuery的疏忽,对吧?

    有没有其他人遇到过同样的问题,除了我上面所描述的以外,你有解决问题的方法或解决方案?

    3 回复  |  直到 13 年前
        1
  •  92
  •   Luis Melgratti    11 年前

    ajax上传程序是否正在刷新您的输入元素? 如果是的话,你应该考虑使用.LeVE()方法。

     $('#imageFile').live('change', function(){ uploadFile(); });
    

    更新:

     $(parent_element_selector_here or document ).on('change','#imageFile' , function(){ uploadFile(); });
    
        2
  •  75
  •   macio.Jun    8 年前

    从jQuery1.7开始,.live()方法就被弃用了。使用.on()附加事件处理程序。较旧版本jQuery的用户应优先使用.delegate(),而不是.live()。参考: http://api.jquery.com/on/

    $('#imageFile').on("change", function(){ uploadFile(); });
    
        3
  •  11
  •   rodney hise    6 年前

    我无法通过向文件输入类型添加jQuery事件处理程序来让IE8+工作。我不得不走老路,加上 onchange=""

    <input type='file' onchange='getFilename(this)'/>
    
    function getFileName(elm) {
       var fn = $(elm).val();
       ....
    }
    

    function getFileName(elm) {
       var fn = $(elm).val();
       var filename = fn.match(/[^\\/]*$/)[0]; // remove C:\fakename
       alert(filename);
    }