Jquery 无法读取未定义的属性“长度”

Jquery Cannot read property 'length' of undefined

本文关键字:属性 长度 未定义 读取 Jquery      更新时间:2023-09-26

我正在尝试使用jquery和ajax发布表单,并且我也有此表单中的文件上传。我已经动态创建了表单,因此我必须找到单击的表单,然后获取此表单的输入值。

$(document).ready(function () {
    $(".audit-form-btn").click(function (e) {
        e.preventDefault();
        //get the form
        var form = $(this).parent().parent().parent().parent();
        // since we have multiple forms/divs with same class name this is how we determine which form button is clicked by getting button's parent
        // then we'll be able to get exact textbox values of clicked button's form
        var parent = $(this).parent().parent().parent();
        var cpDef = parent.find(".cp-def").val();
        console.log("cpDef:" + cpDef);
        var cpImpSug = parent.find(".cp-imp-sug").val();
        console.log("cpImpSug:" + cpImpSug);
        var cpScore = parent.find(".cp-score").val();
        console.log("cpScore:" + cpScore);
        var cpImg = parent.find(".cp-img");
        console.log("cpImg:" + cpImg);
        var aId = parent.attr('data1');
        console.log("aId:" + aId);
        var cpId = parent.attr('data2');
        console.log("cpId:" + cpId);
        var formData = new FormData();
        formData.append("cpDef", cpDef);
        formData.append("cpImpSug", cpImpSug);
        formData.append("cpScore", cpScore);
        formData.append("aId", aId);
        formData.append("cpId", cpId);
        var totalFiles = cpImg.files.length;
        for (var i = 0; i < totalFiles; i++) {
            var file = cpImg.files[i];
            formData.append("file", file);
        }
        console.log(file);
        console.log(formData);
        $.ajax({
            type: "POST",
            url: "/Audits/AddControlPointValues",
            dataType: "JSON",
            contentType: false,
            enctype: 'multipart/form-data',
            processData: false,
            data: formData,
            success: function (returnArgs) {
                alert(returnArgs.Status);
            },
            error: function (xhr, status, error) {
            }
        });
    });
});

我能够获取所有输入值,但无法获取文件输入值。

var totalFiles = cpImg.files.length;
   for (var i = 0; i < totalFiles; i++) {
      var file = cpImg.files[i];
      formData.append("file", file);
}

获得

无法读取未定义的属性"长度"

上述代码错误。如何解决此问题。任何帮助将不胜感激。

我看到你定义了 var cpImg = parent.find(".cp-img")它似乎包含一个 html 元素。

但是,我没有看到您定义cpImg.files(这似乎是您尝试查找其长度的对象)。我是否误解了您的代码,或者正如您的错误所暗示的那样,它没有定义?

阅读刘

易斯的答案后,我更新了我的代码,如下所示,它按预期工作

    var totalFiles = cpImg.get(0).files.length;
    for (var i = 0; i < totalFiles; i++) {
        var file = cpImg.get(0).files[i];
        formData.append("file", file);
    }

这是因为您的cpImg是一个jQuery对象,而不是input

尝试下一个来源

var totalFiles = cpImg.files.length,
    filesInput = cpImg.get(0);
   for (var i = 0; i < totalFiles; i++) {
      var file = filesInput.files[i];
      formData.append("file", file);
}