Question

我正在处理动态表单，该表单根据用户输入将多组输入字段附加到页面。由于需要将一些附加功能附加到其中一些元素，我需要将它们创建为JSON对象。当我只用一个输入元素测试这个方法时，该元素被附加到页面上，没问题。但是，当我尝试将第二个元素合并到流程中时，我会将[object Object] [object Object]附加到页面上。

这里是要点......

//THIS IS THE PROBLEM FUNCTION, WHICH IS TRIGGERED BY THE CHANGE FUNCTION BELOW
function generateInput(siteNumber, x){

    select = $("<select/>", {
                id: 'select'+siteNumber+''+x+'',
                name: 'select'+siteNumber+'['+x+']'
                }).append(list);

    notes = $("<input/>", {
                type: 'text',
                id: 'notes'+siteNumber+''+x+'',
                name: 'notes'+siteNumber+'['+x+']'
                });


    //IF I RETURN ONE OR THE OTHER, NO PROBLEM
    return select + notes;
};

$(document).on("change", ".number_select", function(){
    siteNumber = $(this).parent().attr('data-site_number');
    numberFound = $(this).val();

    for(x = 1; x <= numberFound; x++){
        this['inputArray' + siteNumber].push(generateInput(siteNumber, x));
     };

     $(this).parent().append(this['inputArray' + siteNumber]);
});

我认为问题在于我在generateInput末尾返回元素的方式，但我不确定处理此问题的正确方法。基本上，我的目标是选择元素，文本元素位于它旁边。

非常感谢！

Answer 1

+运算符将调用其中一个术语的toString()方法，如果另一个是字符串。

这不是你想要的，你想要的是将jQuery对象合并为一个

因此

return select + notes;

可以成为（see jquery doc for add）：

return select.add(notes);

Answer 2

如果您有两个对象并添加它们，则使用.toString()方法将它们强制转换为字符串，该方法返回字符串"[object Object]"。这意味着这是一个对象，它是Object的实例。如果要返回两个对象，可以将它们作为数组返回：

return [species, notes];

然后，您可以使用spread operator将结果传递给.push()方法：

this['inputArray' + siteNumber].push(...generateInput(siteNumber, x));

但是，由于.push()方法接受了很多参数，因此您甚至不需要修改这部分代码。

JavaScript - 返回[object Object]

2 个答案: