Javascript 这两个代码之间有什么不同

请注意，包含的$（document）.ready（function（）{}）范围

原代码为：

    var files = [];
    $(document).ready(function(){
      $("input").change(function(){
        files = this.files;
      });
    });

    $("#upload-btn").click(function(){
      var fd = new FormData();
      for (var i = 0; i < files.length; i++) {
        fd.append("file", files[i]);
      }
      $.ajax({
        url: "/upload/",
        method: "POST",
        data: fd,
        contentType: false,
        processData: false,
        cache: false,
        success: function(data){
          console.log(data);
        }
      });
    });

var文件=[]；
$（文档）.ready（函数（）{
$（“输入”）.change（函数（）{
files=this.files；
});
});
$（“#上载btn”）。单击（函数（）{
var fd=新FormData（）；
对于（var i=0；i

更改后的代码为：

var files = [];
$(document).ready(function(){
    $("input").change(function(){
        files = this.files;
    });

    $("#upload-btn").click(function(){
      var fd = new FormData();
      for (var i = 0; i < files.length; i++) {
        fd.append("file", files[i]);
      }
      $.ajax({
        url: "/upload/",
        method: "POST",
        data: fd,
        contentType: false,
        processData: false,
        cache: false,
        success: function(data){
          console.log(data);
        }
      });
    });
});

var文件=[]；
$（文档）.ready（函数（）{
$（“输入”）.change（函数（）{
files=this.files；
});
$（“#上载btn”）。单击（函数（）{
var fd=新FormData（）；
对于（var i=0；i

点是$（document）.ready（function（）{}）的包含范围

---

我不知道有什么不同

关于为什么一个事件绑定在就绪事件处理程序中，而另一个不在就绪事件处理程序中，您的想法是正确的

通常，脚本位于页面的头部，两个事件绑定都需要位于就绪事件处理程序中才能工作。当知道元素已经存在时，需要运行事件绑定代码

如果将代码包含在元素之后的页面中，则不需要ready事件来知道元素存在

---

有一种情况下，原始代码是有意义的。如果它包含在按钮下方，但位于输入上方，则会出现这种情况。然后您知道按钮已经存在，但您需要就绪事件来等待输入存在。

答案取决于此脚本的位置，以及这些元素在DOM中的放置方式和时间。您说的“未放入”是什么意思？请你澄清一下，实际问题是什么？我假设您想知道为什么上传按钮点击事件已经从文档中删除了？非常简单，在加载文档之前，不能单击按钮。也就是说，您不必等待文档准备就绪。您可以在文档准备就绪之前单击。在程序上。所以它应该在document.ready中