加载页面时动态设置 select-options

Question

我需要根据加载页面时从控制器获取的一个值动态设置 select 选项。

<script>
validate selectOptions();

function selectOptions(){
var healthWorkerQuestions1 = "${healthWorkerQuestions}";
if(healthWorkerQuestions1 == "6" || healthWorkerQuestions1 == "7" || healthWorkerQuestions1 == "8"){
                 alert("six to eight"); 
                 $('#questionOptions').empty();
                 var sel = document.getElementById('questionOptions');
                  for(var i = 0; i < drinker.length; i++) {
                    var opt = document.createElement('option');
                    opt.innerHTML = drinker[i];
                    opt.value = drinker[i];
                    $('questionOptions').append(opt).selectmenu('refresh');
                    //sel.appendChild(opt).selectmenu('refresh');
                   }             
        }

}
</script>

此处循环正在执行并且能够看到警告框。 select 框中的选项不会在 select 框中更新。我尝试了以下两种方式，

$('questionOptions').append(opt).selectmenu('refresh');
sel.appendChild(opt).selectmenu('refresh');

但是加载页面时选项没有更新。

select 框的代码是：

<select name="questionOptions" id="questionOptions">
<option>Select</option>
</select>

加载页面后，我只能看到 select 选项，但看不到动态附加值。如何更新页面加载时的 select 选项。

有什么建议请..

Answer 1

代码看起来不错。要更新 select 选项，请调用方法形式 jQuery 文档就绪函数，如下所述，

<script>
$(function(){
selectOptions();
});

function selectOptions(){
// Your code here....
}
</script>

希望对您有所帮助。

加载页面时动态设置 select-options

Dynamically set the select-options while loading the page

javascript

jquery

jquery-ui

jquery-events