AJAX 具有动态表单字段名称的数据

Question

你好怎么才能让我的 ajax 数据调用是动态的，我试过了

var opt_name = $(".NAME").data('opt_name');
    var opt_business = $(".BUSINESS").data('opt_business');
    var opt_phone = $(".PHONE").data('opt_phone');
    var opt_email = $(".EMAIL").data('opt_email');
    var opt_unique_name=$(".UNIQUE_NAME").data('opt_unique_name');
    
    var opt_name_val = $(".NAME")[key].value;
    var opt_business_val = $(".BUSINESS")[key].value;
    var opt_phone_val = $(".PHONE")[key].value;
    var opt_email_val = $(".EMAIL")[key].value;
    var opt_u_val = $(".U_VAL").data('opt_u_val');
    var opt_userid_val = $(".USER_ID_VAL").data('opt_user_id_val');
    var dataString = {'u': opt_u_val,
            'id': opt_userid_val,
            opt_email: opt_email_val,
            opt_name : opt_name_val,
            opt_phone : opt_phone_val,
            opt_business : opt_business_val,
            opt_unique_name : ''};
    $.ajax({
        type: 'post',
        url: 'https://vative.us15.list-manage.com/subscribe/post',
      
        dataType: "json",
      data: dataString, // should be the same as below
      // data: {
        //     'u': '559dd913b49efd5f5515155bb',
        //     'id': '0985c209f3',
        //     'MERGE0': opt_email_val,
        //     'NAME' : 'Test 3',
        //     'PHONE' : '829121',
        //     'BUSINESS' : 'hskslas',
        //     'b_559dd913b49efd5f5515155bb_0985c209f3' : ''
        // },
        success: function(data) {
            console.log('Submitted');
        },
        
        error: function(data){
            console.log('Error');
          console.log(dataString);
        }
    });
}
 

});

我只想获取字段名称，因为此字段名称总是根据数据库或嵌入式表单而变化。

我上面代码的问题是这行得通。

data: {
             'u': '559dd913b49efd5f5515155bb',
             'id': '0985c209f3',
             'MERGE0': opt_email_val,
             'NAME' : 'Test 3',
             'PHONE' : '829121',
             'BUSINESS' : 'hskslas',
             'b_559dd913b49efd5f5515155bb_0985c209f3' : ''
         },

但不是这个

 data: {'u': opt_u_val,
            'id': opt_userid_val,
            opt_email: opt_email_val,
            opt_name : opt_name_val,
            opt_phone : opt_phone_val,
            opt_business : opt_business_val,
            opt_unique_name : ''};

Answer 1

听起来您的目标是在数据对象中包含动态键？

你的例子不工作的原因是实例化一个对象使用键的文字值（所以基本上是一个字符串），而你想要的是范围内变量的字符串值。

做起来有点乱，不过我想到了两种可能：

data = {};
data[opt_email] = opt_email_val;
data[opt_phone] = opt_phone_val;
// and so on for each dynamic key to value

另外，以下可能有效（根据您的目标进行编译后），但我还没有尝试过：

data = {
`${opt_email}`: opt_email_val,
`${opt_phone}`: opt_phone_val,
// and so forth
};

第二个示例使用 Template literal syntax 工作，它将获取变量的值并将其扩展为字符串。

Answer 2

为了在您的对象内部生成动态键，JavaScript（以前称为 ES6）的新 ES2015 标准中有一个非常简洁的方法。

语法如下：

var obj = {
  [myKey]: value,
}

因此您的代码将如下所示：

data: {'u': opt_u_val,
    'id': opt_userid_val,
    [opt_email]: opt_email_val,
    [opt_name]: opt_name_val,
    [opt_phone]: opt_phone_val,
    [opt_business]: opt_business_val,
    [opt_unique_name]: ''
};

AJAX 具有动态表单字段名称的数据

AJAX Data with Dynamic form fields name

javascript

ajax

jquery

ajaxform

jqueryform