Javascript 选择文件后，如何自动提交上传表单？如何更换上传按钮我的代码如下

代码：

<script type='text/javascript'>
            $(document).ready(function(){

                // Upload
                $("#but_upload").click(function(){

                    var fd = new FormData();
                    var files = $('#file')[0].files[0];
                    fd.append('file',files);
                    fd.append('request',1);

                    // AJAX request
                    $.ajax({
                        url: 'addremove.php',
                        type: 'post',
                        data: fd,
                        contentType: false,
                        processData: false,
                        success: function(response){

                            if(response != 0){
                                var count = $('.uploaded-images .image-content').length;
                                count = Number(count) + 1;

                                // Show image preview with Delete button
                                $('.uploaded-images').append("<div class='image-content' id='content_"+count+"' ><img class='image-responsive' src='"+response+"' width='125' height='125'><span class='delete' id='delete_"+count+"'>&times;</span><span class='under-approval'>Under Approval</span></div>");
                            }else{
                                alert('file not uploaded');
                            }
                        }
                    });
                });

                // Remove file
                $('.uploaded-images').on('click','.image-content .delete',function(){

                    var id = this.id;
                    var split_id = id.split('_');
                    var num = split_id[1];

                     // Get image source
                    var imgElement_src = $( '#content_'+num+' img' ).attr("src");

                    // AJAX request
                    $.ajax({
                       url: 'addremove.php',
                       type: 'post',
                       data: {path: imgElement_src,request: 2},
                       success: function(response){

                            // Remove <div >
                            if(response == 1){
                                $('#content_'+num).remove();
                            }

                       }
                    });
                });

            });
        </script>

$（文档）.ready（函数（）{
//上传
$（“#但#上传”）。单击（函数（）{
var fd=新FormData（）；
var files=$（'#file'）[0]。文件[0]；
fd.append（'file'，files）；
fd.append（'request'，1）；
//AJAX请求
$.ajax({
url:'addremove.php'，
键入：“post”，
数据：fd，
contentType:false，
processData:false，
成功：功能（响应）{
如果（响应！=0）{
var count=$（'.upload images.image content'）。长度；
计数=数（计数）+1；
//使用“删除”按钮显示图像预览
$（“.upload images”）.append（“×；正在审批中”）；
}否则{
警报（“文件未上载”）；
}
}
});
});
//删除文件
$（'.Upload images'）。在（'单击'，'图像内容.delete'，函数（）上{
var id=this.id；
var split_id=id.split（“”“）；
var num=split_id[1]；
//获取图像源
var imgElement_src=$（'#content_'+num+'img'）.attr（“src”）；
//AJAX请求
$.ajax({
url:'addremove.php'，
键入：“post”，
数据：{path:imgElement_src，请求：2}，
成功：功能（响应）{
//除去
如果（响应==1）{
$（'#content'+num）.remove（）；
}
}
});
});
});

这是我的问题：

<script type='text/javascript'>
            $(document).ready(function(){

                // Upload
                $("#but_upload").click(function(){

                    var fd = new FormData();
                    var files = $('#file')[0].files[0];
                    fd.append('file',files);
                    fd.append('request',1);

                    // AJAX request
                    $.ajax({
                        url: 'addremove.php',
                        type: 'post',
                        data: fd,
                        contentType: false,
                        processData: false,
                        success: function(response){

                            if(response != 0){
                                var count = $('.uploaded-images .image-content').length;
                                count = Number(count) + 1;

                                // Show image preview with Delete button
                                $('.uploaded-images').append("<div class='image-content' id='content_"+count+"' ><img class='image-responsive' src='"+response+"' width='125' height='125'><span class='delete' id='delete_"+count+"'>&times;</span><span class='under-approval'>Under Approval</span></div>");
                            }else{
                                alert('file not uploaded');
                            }
                        }
                    });
                });

                // Remove file
                $('.uploaded-images').on('click','.image-content .delete',function(){

                    var id = this.id;
                    var split_id = id.split('_');
                    var num = split_id[1];

                     // Get image source
                    var imgElement_src = $( '#content_'+num+' img' ).attr("src");

                    // AJAX request
                    $.ajax({
                       url: 'addremove.php',
                       type: 'post',
                       data: {path: imgElement_src,request: 2},
                       success: function(response){

                            // Remove <div >
                            if(response == 1){
                                $('#content_'+num).remove();
                            }

                       }
                    });
                });

            });
        </script>

选择文件后，如何自动提交上传表单

如何更换上传按钮我的代码如下

---

任何有此领域经验的人，请向我建议解决此问题的方法，谢谢。

您可以使用以下

JQuery

代码：

$("#fileInput").change(function () {
    $('#form').submit();
});

您可以使用以下选项：

$('#file').on('change', function() {
    $("#but_upload").click();
});

或者最好将您的点击代码放入更改事件中

$('#file').on('change', function() {
   var fd = new FormData();
   var files = this.files[0];
   ...
});

---

在提问之前，请仔细阅读本节内容，并提出一些漂亮的问题$（document）.ready（function（）{//Upload$（'#file'）。在（'change'，function（）{$（“#but#Upload”）。单击（）这不管用，我身体不好javascript@user9515436很难从注释中的代码中看到它，因为它在一行中，所以它在注释中，但缺少了两行；和end@user9515436您是否包含了您的

$（“#但_上载”）。单击（函数（）{…}）

？现在可以使用了吗？$（文档）。准备好了吗（function（）{//Upload$（“#fileInput”）.change（function（）{$（'#form'）.submit（）；var fd=new FormData（）；var files=$（'#file'）[0]。files[0]；fd.append（'file'，files）；fd.append（'request'，1）；@user9515436如果您将ajax代码放入更改事件中，则不需要提交（）。它可以工作，但在上载图像时，我遇到了另一个问题，将一些图像放置在何处，删除/取消按钮不工作，以及更多问题–现在工作正常此脚本中的宽度=125高度125 css使用它给出了如何摆脱它的拉伸缩略图！