Select 默认情况下 <select> 中的所有选项

Question

我在给html充电时需要，select默认选项列表中的所有选项：这是我在 .inc

中的代码的一部分

drupal_add_js(
            "
            var projects='$projectsEncode';
            var narrativeList='$narrativeListEncode';
            var outputs='$outputsEncode';
            var topoNetwork='$topologicalNetworkEncode';
            var datasetUuid='$datasetUuid';
            var narrativeCount='$narrativeCount';
            var footprintNid='$footprintLayersEncode';
            ",
            'inline'
        );

这是我在 .js 中的代码的一部分

var narratives = JSON.parse(narrativeList);
var narrativeDropdown = $("#narrativeMode");
narratives.forEach(function (narrative) {
narrativeDropdown.append('<option value=' + narrative.nid + '> 
 Narrativa ' + narrative.name + '</option>');
  });
var elements = document.getElementById("narrativeMode").options;
console.log("Elementos cargados:",elements)
for(var i = 0; i < elements.length; i++){
 elements[i].selected= true;

}

这是 html。

<select class="mi-selector custom-select" multiple='multiple' data-style="form-control" data-live-search="true" title="-- Seleccione mínimo 1--" id="narrativeMode">

        </select>

感谢您的帮助

Answer 1

您的代码不起作用，因为您比较的是 selected 而不是归因。

改变这个：

for(var i = 0; i < elements.length; i++){
  elements[i].selected== true; // Note the use of == here
}

对此：

for(var i = 0; i < elements.length; i++){
  elements[i].selected = true; // Note the use of single = here
}

Answer 2

您正在比较值，而不是设置它们：

elements[i].selected == true;

使用：

elements[i].selected = true;

工作示例：

var narrativeDropdown = $("#narrativeMode");
var elements = document.getElementById("narrativeMode").options;
console.log("Elementos cargados:", elements)
for (var i = 0; i < elements.length; i++) {
  elements[i].selected = true;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select class="mi-selector custom-select" multiple='multiple' data-style="form-control" data-live-search="true" title="-- Seleccione mínimo 1--" id="narrativeMode">
  <option>1</option>
  <option>2</option>
  <option>3</option>
</select>

更新

您可以在创建选项元素时添加selected：

narrativeDropdown.append('<option value=' + narrative.nid + ' selected> 
  Narrativa ' + narrative.name + '</option>');
});

通过这样做，您不必再次循环选项，因此您可以删除此循环：

for(var i = 0; i < elements.length; i++){
  elements[i].selected= true;
}

Select 默认情况下 <select> 中的所有选项

Select by default all options in <select>

html

javascript

php

drupal

option