在PHP中用单个按钮从计算机上传图片

时间:2013-09-25 06:58:36

标签: javascript php jquery image-uploading

<html>
   <head>
      <title>File Upload Form</title>
   </head>
   <body>
      This form allows you to upload a file to the server.<br />
      <form action="getfile.php" method="post"><br />
         Type (or select) Filename: 
         <input type="file" name="uploadFile" />
         <input type="submit" value="Upload File" />
      </form>
   </body>
</html>

我正在研究一种php语言。我正在从我的电脑上传一张照片。但是有两个按钮,即选择文件和上传文件。 CHOOSE FILE用于从PC中选择图片,上传文件按钮用作SUBMIT按钮,但我需要一个按钮,点击它会打开我的电脑窗口浏览照片并选择它,它也可以作为提交按钮。有没有办法用单个按钮

来做到这一点

5 个答案:

答案 0 :(得分:5)

您需要更改表单标记中的内容:

1) Add a name tag: say name="frm"
2) enctype="multipart/form-data"

Then in your input file type add a function onchange="frm.submit();" // Where frm is name of the form 

答案 1 :(得分:3)

您可以在input type="file"上等待事件更改,并在此事件发送后发送文件。

如果您使用jQuery,则可以使用.submit()发送表单。

尝试使用类似的东西

$("input[type='file']").on("change", function(){
   $("form").submit();
});

.on("change", handler)http://api.jquery.com/change/

.submit()http://api.jquery.com/submit/

答案 2 :(得分:0)

使用了jquery uplodify:uploadify

Demo

$(function() {
    $("#file_upload_1").uploadify({
        height        : 30,
        swf           : '/uploadify/uploadify.swf',
        uploader      : '/uploadify/uploadify.php',
        width         : 120
    });
});

还要检查此内容以自动上传auto upload

答案 3 :(得分:0)

这就是我在项目中所做的:

HTML:

<input type="button" id="btnUpload" value="Upload File" />
<form action="getfile.php" method="post" id="upload_form" style="display: none;">
    Type (or select) Filename: 
    <input type="file" name="uploadFile" />
</form>

的Javascript

$(function(){
    $('#btnUpload').click(function(){
        //Show select file dialog
        $('#uploadFile').click();

        //Wait for user to select a file
        var tmr = setInterval(function(){
            if($('#uploadFile').val() !== "") {
                clearInterval(tmr);
                $('#upload_form').submit();
            }
        }, 500);
    });
});

答案 4 :(得分:0)

这是代码。只要按原样使用它就可以了。

<html>
<head>
<title>File Upload Form</title>
</head>
<script>
$(document).ready(function(){
$("input[type='file']").on("change", function(){
$("#form1").submit();
});
});
</script>
   <body>
  This form allows you to upload a file to the server.<br />
  <form action="getfile.php" method="post" enctype="multipart/form-data" id="form1"><br />
     Type (or select) Filename: 
     <input type="file" name="uploadFile" />
     <input type="submit" value="Upload File" />
  </form>
  </body>
</html>