Question

我在一个html页面中有8个选择标记。这是其中之一。

if ([response_json][credit][balance]) {
    mutate {
        add_field => {"new_credit" => "%{[response_json][credit][balance}"}
        remove_field => [ "[response_json][credit]" ]
    }
}
else {
    mutate {
        add_field => {"new_credit" => "%{[response_json][credit]}"}
        remove_field => [ "[response_json][credit]" ]
    }
}

如果我有一些随机默认值需要预设为<select id="list1" name="cat1"> <option value="0">Select Option</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> </select>等选项。让我们说一个默认列表= [2,5,6,4,3,6,8,9]。如何最有效地解决这个问题呢？

任何jquery函数都设置默认选项值？提前谢谢。

Answer 1

除非您为<select>提供<select>属性，否则您无法在multiple中选择多个选项：

<select id="list1" name="cat1" multiple>
    <option selected>Some selected option</option>
    <option>Not selected</option>
    <option selected>This is also selected<option>
    ...
</select>

这样，您可以为<option>属性提供多个selected。

如果需要从JS中选择数组提供的多个值，可以执行以下操作：

[2, 5, 6, 4, 3, 6, 8, 9].forEach(function(valToSelect) {
  $( 'select#list1' ).find('option[value="' + valToSelect + '"]').prop('selected', true);
});

Answer 2

这应该有用......

var list = [2, 5, 6, 4, 3, 6, 8, 9]
$('select').each(function(i, el) {
  var random = Math.floor(Math.random() * ((list.length - 1) - 0) + 0)
  $(this).val(function() { return list[random]})
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="list1" name="cat1">
  <option value="0">Select Option</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
</select>
<select id="list1" name="cat1">
  <option value="0">Select Option</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
</select>
<select id="list1" name="cat1">
  <option value="0">Select Option</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
</select>
<select id="list1" name="cat1">
  <option value="0">Select Option</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
</select>
<select id="list1" name="cat1">
  <option value="0">Select Option</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
</select>
<select id="list1" name="cat1">
  <option value="0">Select Option</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
</select>
<select id="list1" name="cat1">
  <option value="0">Select Option</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
</select>
<select id="list1" name="cat1">
  <option value="0">Select Option</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
</select>

Answer 3

假设文档中的八个选择元素的顺序与数组中的默认值相同，则可以执行以下操作：

var defaults = [2,5,6,4,3,6,8,9];
$("select").val(function(i) { return defaults[i]; });

当你pass a function to the .val() method时，jQuery会为每个匹配的元素调用该函数一次，将元素的值设置为函数返回的值。函数的第一个参数将是集合中元素的索引位置，这样可以方便地从数组中获取正确的值。

显然，您可以使用比"select"更具体的选择器，例如，如果相关的选择元素有一个可以由该类选择的公共类。

演示：

var defaults = [2,5,6,4,3,6,8,9];
$("select").val(function(i) { return defaults[i]; });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select id="list1" name="cat1">
  <option value="0">Select Option</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
</select>
<select id="list2" name="cat1">
  <option value="0">Select Option</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
</select>
<select id="list3" name="cat1">
  <option value="0">Select Option</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
</select>
<select id="list4" name="cat1">
  <option value="0">Select Option</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
</select>
<select id="list5" name="cat1">
  <option value="0">Select Option</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
</select>
<select id="list6" name="cat1">
  <option value="0">Select Option</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
</select>
<select id="list7" name="cat1">
  <option value="0">Select Option</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
</select>
<select id="list8" name="cat1">
  <option value="0">Select Option</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
</select>

Answer 4

您应该提供有关您问题的更多信息。您的默认列表是否包含要为每个选择元素选择的元素？它们是有序的吗？在这种情况下，我会做以下事情。

将每个select元素分配到同一个类：

<select id="list1" name="cat1" class="random-selected">
    ...
</select>

使用jQuery分配每个选定的值：

var default_list = [2, 5, 11, 6]; // define what should be selected

// loop through the selects
$('.random-selected').each(function(i, obj) {
    // if our array at the index is defined
    if (default_list[i]) { 
      // if our select contains the value
      if ($(this).find('option[value=' + default_list[i] + ']').length > 0) {
          // set the selected value to be that in the default list
          $(this).val(default_list[i]);
      }
    }
});

Fiddle

html：如何在多个选择标签中添加默认选项？

4 个答案: