使用Jquery或JavaScript從Select下拉數組中選擇或獲取所有值

Question

我有以下HTML代碼。

<Select name=test[]>
  <option value="">--Please Select--</option>
  <option value="a">Test Value1</option>
</select>

<Select name=test[]>
  <option value="">--Please Select--</option>
  <option value="a">Test Value2</option>
</select>

<Select name=test[]>
  <option value="">--Please Select--</option>
  <option value="a">Test Value3</option>
</select>

現在，在提交表單之前，我想要執行以下操作

1. 檢查是否選擇了上述任何一項。
2. 如果選中則檢索其值。

我相信我需要循環但我無法找到初始語法，我可以先獲取所有值。

我知道如何在為select元素指定'id'時檢查是否選擇了任何值。 但在這種情況下，我有'name'屬性，這是一個數組。

我試着去看不同的地方，但我沒有真正找到一個好的解決方案。 可能我錯過了一些東西。

如果需要任何進一步的信息，請告訴我。

Answer 1

使用地圖功能

var selected = $('select[name="test[]"]').map(function(){
    if ($(this).val())
        return $(this).val();
}).get();

console.log(selected);

Answer 2

這不是一個完整的解決方案，但可能有希望指出你正確的方向（假設你使用jQuery）

下面的代碼應循環遍歷您的選擇（當它們具有name='test[]' ）並將任何值（非空白）添加到結果數組中。

var results = [];
$("select[name='test[]']").each(function(){
    var val = $(this).val();
    if(val !== '') results.push(val);  
});
console.log(results);

演示： http ： //jsfiddle.net/W2Mam/

Answer 3

以下內容將允許您遍歷選擇標記，這些標記具有除默認值“”之外的任何選定值。 您可以將其調整為任何其他不需要的值等。

$("select[name='test[]']").each(function(){
    if($(this).val()!='')
    {
        //doStuff
    }
});

Answer 4

您可以通過這種方式檢查和保存方框值

var results = [];
$("select[name='test[]']").each(function(index, val) 
{
   if ($(val).val() == "") { 
       //Not selected 
   }
   else
   {
       //Selected
   }
   //Save results in an array based on the index of selects
   results[index] = $(val).val();
});

然后你可以通過數組並根據索引檢查值（或者你可以在.each（）函數上面檢查它）

Answer 5

嘗試這樣做：

$("select[name='test[]']").on('change', function(){
    if(this.value != ""){
        alert(this.value);
     }else{
        alert('no values selected');
        return false;
     }
});

---

您必須獲取change事件的值，因此使用屬性選擇器獲取元素，然后您可以獲取目標元素的值。

Answer 6

如果你使用這個：

var values = $('select[name^="test["]').map(function(){
    if(this.value !== "") return this.value;
})

你將擁有一系列價值觀。

要檢查是否選擇了一個，只需檢查length： values.length

Answer 7

您可以使用filter()僅返回具有值的selects ，然后使用map()獲取其值：

var values = $('select[name="test[]"]').filter(function() {
  return $.trim(this.value).length;  
}).map(function() {
  return this.value;
}).get();

顯然，你不知道哪個選擇具有哪個值，如果你需要知道，你必須使用元素的索引，因為它是唯一的唯一標識符（給定你的標記）。

以下將返回包含元素索引及其值的對象數組：

var values = $('select[name="test[]"]').filter(function() {
  return $.trim(this.value).length;  
}).map(function() {
  return { index: $(this).index(), value: this.value };
}).get();

要檢查是否選擇了任何內容，您只需檢查values.length ：

if (!values.length) {
  alert('Nothing was selected');
}

這是一個小提琴