<option>標籤，顯示：none和jquery

我有一個div被用作jQuery的.dialog()的對話框。這個div有一個選項框。用戶已經選擇的選項顯示在主頁面上。他們可以從主頁面中刪除選項，並可以多次打開對話框以添加更多選項。<option>標籤，顯示：none和jquery

我使用頁面加載時填充所有可能選項的選擇框，但是當我打開對話框時，我使用jQuery的hide()來隱藏用戶已經選擇並顯示在主頁上的選項。這會將CSS display:none;添加到所討論的元素中，IE忽略<option>標記和顯示。

我可以很容易地調用remove()，並將其從DOM中移除。但是，如果用戶選擇某些選項，則它們會在主頁面上將它們刪除，然後再次打開對話框以選擇更多選項，選項不再按字母順序排列，從DOM中刪除並放回的選項是現在在我使用.append()以來的最低點。

有什麼辦法讓IE隱藏<option>標籤？還是有更好的方法來做到這一點？或者有沒有簡單的按字母順序插入的方法？

來源

2010-01-18 asdf1234

順便說一句，歡迎來到StackOverflow asdf1234！令人難忘的第一個問題 – Sampson 2010-01-18 22:17:47

爲什麼令人印象深刻？ – asdf1234 2010-01-18 22:18:48

觀看其他新用戶詢問的內容，最終你會看到爲什麼:) – Sampson 2010-01-18 22:23:33

如果您需要從DOM中刪除它，您可以將選項存儲在一個數組中。一個數組（或對象）爲每個選項列表。然後從列表中刪除選項本身是可逆的。您始終可以重新從陣列重建選擇菜單。只要dom-ready事件觸發就填充數組。

在線演示：http://jsbin.com/avuru

$(function(){ 

    // Define variables to be used throughout this code 
    var colors  = []; 
    var list  = $("select[name='colors']"); 
    var btnRestore = $("button[name='restore']"); 
    var btnRemove = $("button[name='remove']"); 

    // Cycle through each option, adding its value and text to our collection 
    $("option", list).each(function(i, o){ 
    colors.push({ 'key':$(this).val(),'val':$(this).text() }); 
    }); 

    // Remove any remaining options, and add collection back into dropdownlist 
    $(btnRestore).click(function(){ 
    $("option", list).remove(); 
    for (var i = 0; i < colors.length; i++) { 
     $("<option>").val(colors[i].key).text(colors[i].val).appendTo(list); 
    } 
    }); 

    // Remove first option from list - used to test 'Restore' functionality 
    $(btnRemove).click(function(){ 
    $("option:first", list).remove(); 
    }); 

});

來源

2010-01-18 21:07:10 Sampson

我會克隆選項列表修改之前，並保持原有的周圍。這樣，你可以重新插入乾淨，通過用orignal替換修改的乾淨。

來源

2010-01-18 21:08:25 prodigitalson

<option>標籤，顯示：none和jquery

回答

相關問題