提取select元素的值作爲查詢字符串數組

Question

我正在從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陣列，作爲array.i想從選項獲取所有值和效仿這樣的查詢保存的值。

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

因此它被服務器端作爲數組接收。

P.S：請注意，我想從選擇元素中提取所有元素而無需用戶選擇任何元素，因此，不使用選定的屬性。我嘗試使用serialize()哪些不起作用，因爲serialize()需要選擇的元素，在我的情況下，這是不正確的。

謝謝

Answer 1

你可以嘗試這樣的事：如果

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

不知道這是最優雅的方式。它通過Array.join函數使用簡單的字符串連接。

Answer 2

對於上述問題，我做了完整的bin。因此，請在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; 
    }); 
});