第一次单击选择标签时如何附加选项？答案

【问题标题】：How to append options when click first time on select tag?第一次单击选择标签时如何附加选项？
【发布时间】：2014-01-08 09:05:23
【问题描述】：

第一次点击选择标签时如何附加选项？这意味着选择标签在第一次单击之前没有选项。我尝试如下代码，但直到第二次单击才会显示选项，我希望在第一次单击选择标签时立即显示选项。请帮帮我。

<select id="cbVoice" onclick="ClickMe()"></select>

function ClickMe(){
if($('#cbVoice > option').length == 0){ 
var TheOptions = "<option>Option 1</option><option>Option 2</option><option>Option 3</option><option>Option 4</option>";
        $('#cbVoice').html(TheOptions);
}

}

【问题讨论】：

标签： javascript jquery select append option

【解决方案1】：

您可以将mousedown 与one() 一起使用，并为options 使用一个简单的循环：

$('#cbVoice').one('mousedown', function() {
   var numOfOpts = 4, opts = [];
   for (var i = 1; i <= numOfOpts; i++) {
       opts.push( $('<option>', { text: 'Option ' + i }) );
   }
   $(this).append(opts);
});

Here's a fiddle

【讨论】：

【解决方案2】：

试试这个

function ClickMe(){
if($('#cbVoice > option').length == 0){ 
var TheOptions = "<option>Option 1</option><option>Option 2</option><option>Option 3</option><option>Option 4</option>";
        $('#cbVoice').empty().append(TheOptions);
}

}

DEMO

【讨论】：

【解决方案3】：

$.each(selectValues, function(key, value) {   
     $('#mySelect')
         .append($("<option></option>")
         .attr("value",key)
         .text(value)); 
});

What is the best way to add options to a select from an array with jQuery? 的副本

【讨论】：

【解决方案4】：

试试这个：

<select id="cbVoice"></select>

<script type="text/javascript">
var $cbVoice = $("#cbVoice");
$cbVoice.on('mousedown', function(e) {
    if ($('option', $cbVoice).length == 0) {
        $cbVoice.html('<option>Option 1</option><option>Option 2</option><option>Option 3</option><option>Option 4</option>');
    }
});
</script>

演示：http://jsfiddle.net/eeSGN/

【讨论】：