触发文件上传与jQuery

Question

我试着去创建我的自定义样式表单文件输入按钮。

下面是代码，但它不起作用。

<style type="text/css"> 
.pictures { width:200px; height:70px; overflow:hidden;} 
    input{position:absolute; top:-100px;} 
</style> 


<form id="test_form" method="post"> 

<div class="pictures"> 
    <input type="file"> 
    <button>Upload</button> 
     <label>No file selected</label> 
</div> 

<div class="pictures"> 
    <input type="file"> 
    <button>Upload</button> 
     <label>No file selected</label> 
</div> 

<div class="pictures"> 
    <input type="file"> 
    <button>Upload</button> 
     <label>No file selected</label> 
</div> 

</form> 

<script> 
    $(function(){ 
     $("button").click(function() { 
     var $this = $(this), 
      inputVal = $this.closest('input').val(); 

     $this.closest('input').click(
      function(){ 
       $(this).change(function(){ 
        $this.closest('label').text(inputVal); 
       }); 
      } 
     );  

    }) 
    }); 
</script> 

Answer 1

这可能是值得你来看看这个帖子：How can I upload files asynchronously?

快速谷歌搜索“jQuery的文件上传”也显示，有几个插件可用来完成你在做什么试图做的，很可能是你可以自定义造型为那些插件，使它们看起来你怎么样。

我个人很喜欢this one by blueimp。