YUI - 删除选择选项

时间:2012-04-10 16:35:06

标签: javascript yui

我有一个HTML select元素,其中有一些国家/地区作为选项。

<select id="countryLocation" class="selectCountryPrefix enablePartialForm" onchange="document.locationchangeform.submit()" name="country">
    <option selected="selected" disabled="disabled" value="">Select country</option>
    <option class="showTos-AU" title="+61" value="AU">Australia</option>
    <option class="showTos-CA" title="+1" value="CA">Canada</option>
    <option class="showTos-CL" title="+56" value="CL">Chile</option>
    <option class="showTos-DK" title="+45" value="DK">Denmark</option>
    <option class="showTos-EE" title="+372" value="EE">Estonia</option>
    <option class="showTos-FI" title="+358" value="FI">Finland</option>
    <option class="showTos-GR" title="+30" value="GR">Greece</option>
    <option class="showTos-HU" title="+36" value="HU">Hungary</option>
    <option class="showTos-IE" title="+353" value="IE">Ireland</option>
    <option class="default showTos-LV" selected="selected" title="+371" value="LV">Latvia</option>
    <option class="showTos-TW" title="+886" value="TW">Taiwan</option>
</select>

我想删除所有国家/地区代码不等于“TW”的选项。到目前为止,这是我的代码:

YAHOO.util.Event.addListener(window, "load", function() {

    var E = YAHOO.util.Event;
    var D = YAHOO.util.Dom;

    var opts,
        select,
        i;

    select = D.get('countryLocation');
    opts = select.options;
    for (i=0; i< opts.length-1; i++){
        if (opts[i].value !== ""){
            if (opts[i].value !== "TW"){
                select.remove(i);
            }
        } 
    }

})

它仅适用于某些选项 - 我猜测因为它是通过索引删除它们然后索引在每个删除后都会发生变化。我真的想要它像jQuery .each()函数。

我怎样才能在YUI中或只是简单的JS?

2 个答案:

答案 0 :(得分:2)

另一种方法(关于Brant Olsen的回答)是向后迭代:

for (i=opts.length-1; i >= 0; i--){
    if (opts[i].value !== ""){
        if (opts[i].value !== "TW"){
            select.remove(i);
        }
    } 
}

当从数组中删除对象时(通常在迭代中),我通常采用这种方法。

答案 1 :(得分:1)

删除选项后,您希望减少i值。否则,您将跳过删除后的所有选项。

for (i=0; i< opts.length-1; i++){
    if (opts[i].value !== ""){
        if (opts[i].value !== "TW"){
            select.remove(i);
            --i;
        }
    } 
}