2011-08-05 55 views
0

我有一个输入文件显示/隐藏基地

<input type="file" name="image" id="file"> 

和一个按钮,保存这个文件

<input type="submit" value="Upload/Edit picture" name="upload_picture" id="upload_picture" class="btn" /> 

我需要一个JavaScript,将隐藏按钮,如果文件不是选择= 0,否则显示按钮,如果文件选择。

+0

正如一个设计问题:会不会是更好禁用提交按钮,而不是隐藏它?我认为一个不显示的提交按钮仍然可以通过按或类似提交。 – Willem

回答

1
<input type="file" name="image" id="file"> 

<input type="submit" value="Upload/Edit picture" name="upload_picture" id="upload_picture" class="btn" /> 

<script> 
$(function(){ 
    $("#upload_picture").hide(); 
    $("#file").change(function(){ 
     if ($("#file").val() != ""){ 
      $("#upload_picture").show(); 
     } 
     else{ 
      $("#upload_picture").hide(); 
     } 
    }); 
}); 
</script> 

http://sandbox.phpcode.eu/g/6d8cd.php

0

试试这个

$("#file").change(function(){ 
    if(!$(this).val()){ 
     $("#upload_picture").hide(); 
    } 
    else{ 
     $("#upload_picture").show(); 
    } 
}); 
1
$('#file').change(function(){ 
    $('#upload_picture').show(); 
}); 

和小提琴:http://jsfiddle.net/xGAVj/

+0

这不会像预期的那样正常工作。在某些情况下,这可能会导致在您刚清空输入字段时显示提交按钮。 – Willem

1

HTML:

<input id="fld" type="file" name="image" id="file"> 

<input id="btn" type="submit" value="Upload/Edit picture" name="upload_picture" id="upload_picture" class="btn" /> 

的Javascript:

$("#fld").change(function(){ 
     if($(this).val() != "") 
     { 
      $("#btn").toggle(); 
     } else{ 
      $("#btn").toggle(); 
     } 
}); 

工作实例:http://jsfiddle.net/saDFC/

+0

谢谢你的例子和生活预览! – Viktors

+0

@Viktors Golubevs没问题小心接受还是+1? –