将select元素的值作为查询字符串数组获取

时间:2012-07-23 09:35:27

标签: jquery

我从select元素中获取所有值,使用这段jquery代码不会有selected属性。

$('#purchaseEditUpdateItemBtn').on('click', function(){
    var selected = [];
    $('#box2View option').each(function(index, element){ 
        selected[index] = $(element).val(); 
    });
    return false;
});

这是我的选择框。

 <select id="box2View" multiple="multiple" class="multiple">
     <option value="1">ITEM001</option>
     <option value="2">ITEM002</option>
     <option value="3">ITEM003</option>
     <option value="4">ITEM004</option>
 </select>

这将创建一个名为selected的javascript数组,并将值保存为数组。我想从选项中获取所有值并像这样模拟查询。

estimate_id[]=1&estimate_id[]=2&estimate_id[]=3&estimate_id[]=4

以便服务器端将其作为数组接收。

P.S:请注意,我想从select元素中获取所有元素,而无需用户选择任何元素,因此,因此不使用selected属性。我尝试使用serialize()无效,因为serialize()要求选择元素,在我的情况下这不是真的。

谢谢

2 个答案:

答案 0 :(得分:2)

您可以尝试这样的事情:

$('#purchaseEditUpdateItemBtn').click(function(){
    var selected = [];
    $('#box2View option').each(function(index, element){ 
        selected[index] = 'estimate_id[]=' + $(element).val(); 
    });
    alert(selected.join('&')); 
    return false;
});​

不确定这是否是最优雅的方式。它通过Array.join函数使用简单的字符串连接。

答案 1 :(得分:0)

对于上述问题,我已完成垃圾箱。所以,请查看http://codebins.com/bin/4ldqp9x

上的演示

<强> HTML:

<select id="box2View" name="box2View" multiple="multiple" class="multiple">
  <option value="1">
    ITEM001
  </option>
  <option value="2">
    ITEM002
  </option>
  <option value="3">
    ITEM003
  </option>
  <option value="4">
    ITEM004
  </option>
  <option value="5">
    ITEM005
  </option>
  <option value="6">
    ITEM006
  </option>
  <option value="7">
    ITEM007
  </option>
</select>
<p>
  <input type="button" id="purchaseEditUpdateItemBtn" name="purchaseEditUpdateItemBtn" value="Show Items" />
</p>

<强> JQuery的:

$(function() {
    $('#purchaseEditUpdateItemBtn').on('click', function() {
        var selected = new Array();
        var i = 0;
        $('#box2View option').each(function(index, element) {
            if ($(this).is(":selected")) {
                selected[i] = "box2View[]=" + $(element).val();
                i++;
            }
        });
        if (selected.length > 0) {
            alert(selected.join('&'));
        }
        return false;
    });
});