Question

在我的页面上，我有多个下拉列表，如下：

<select class="form-control extra-dropdown" id="extra-1" name="extra[1]">
    <option value="0">0</option>
    <option value="1">1</option>
</select>

<select class="form-control extra-dropdown" id="extra-2" name="extra[2]">
    <option value="0">0</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>

<select class="form-control extra-dropdown" id="extra-3" name="extra[3]">
    <option value="A">A</option>
    <option value="B">B</option>
</select>

这些下拉列表是动态创建的 - 取决于用户来自何处以确定显示下拉列表的内容和数量。

当用户更改这些选项中的任何一个时，我想使用jQuery.ajax运行php脚本，并且它需要extra []的所有选定值。所以它会是这样的：

$('select.extra-dropdown').change(function(){
    $.ajax({
        type: 'POST',
        url: 'my-ajax-script.php',
        data: { 
            postVar1: $('#extra-1').val(), 
            postVar2: $('#extra-2').val(),
            postVar3: $('#extra-3').val()
        },
        beforeSend:function(){
            // show loader...
        },
        success:function(data){
            // show xxx...
        },
        error:function(){
            // show errors...
        }
    });
});

但是，如何根据页面上有多少下拉选项填充data: {} dynicamlly。它可以从页面上的1到最多20个不等。

Answer 1

尝试这样做：

var dataOut = [];
$.each($('.extra-dropdown'),function(index,value){
    dataOut['extra-'+index] = $(this).val();
    //or 
    //dataOut[$(this).attr('id')] = $(this).val();       
});

然后

data : dataOut

Jquery Ajax的动态后期数据值

1 个答案: