Javascript 通过ajax在提交时上载图像

我想用ajax将文件（图像）提交给php，但我看到的所有教程和参考都是用“onchange”事件将文件分配给变量的

但我想在用户单击submit时发送此请求。 但它总是出错- “无法读取未定义的属性0”

jQuery（文档）.ready（函数（$）{
$（“#btn”）。在（'click'，函数（事件）{
event.preventDefault（）；
var i=新FormData（）；
var p=$（“#img”）.files[0]；//此处不断出现错误，表示“无法读取未定义的属性0”
i、 附加（'image'，p）；
$.ajax({
url:'upload.php'，
键入：“POST”，
数据类型：“formdata”，
数据：我，
成功：功能（响应）{
控制台日志（响应）；
}
})
});
});

如果要异步上载文件，需要使用IFRAME

对于jquery，存在非常有用的插件

例如：

-- Use as little as --

    $('#one-specific-file').ajaxfileupload({
      'action': '/upload.php'
    });

-- or as much as --

    $('input[type="file"]').ajaxfileupload({
      'action': '/upload.php',
      'params': {
        'extra': 'info'
      },
      'onComplete': function(response) {
        console.log('custom handler for file:');
        alert(JSON.stringify(response));
      },
      'onStart': function() {
        if(weWantedTo) return false; // cancels upload
      },
      'onCancel': function() {
        console.log('no file selected');
      }
    });

你可以加上这个

var p = file = $("#img")[0].files[0];
var fileName = file.name;
var fileSize = file.size;
alert("Uploading: "+fileName+" @ "+fileSize+"bytes");

---

从这个问题来看

太笼统了..我想要一些非常个性化的东西，因为我不仅需要发送图像，还需要发送一些额外的变量，但是现在在$.ajax行出现了一个新错误..像Alexander一样说“非法调用”。Shtanko说，你需要使用iframe，非法部分来自jquery，不允许访问您的系统，这是一个安全问题请提供一些链接，以供有关如何使用iframe的参考

var p = file = $("#img")[0].files[0];
var fileName = file.name;
var fileSize = file.size;
alert("Uploading: "+fileName+" @ "+fileSize+"bytes");