Question

我有html：

<select id="sel">
    <option value="1">aaa</option>
    <option value="2">bbb</option>
    <option value="3">ccc</option>
    <option value="4">ddd</option>
    <option value="5">eee</option>
    <option value="6">fff</option>
    <option value="7">ggg</option>
</select>

<button id="remove">remove</button>
<button id="restore">restore</button>

和javascript：

function rand(){
return Math.floor(Math.random() * 7) + 1;
}

function deleteRandom(){

$.each([rand(), rand(), rand()], function( index, value ) {
  $("#sel option[value=" + value + "]").remove();
    //here should be saved...
});

}

function restore(){
 //this function should restore #sel
}

$("#remove").click(function(){
   deleteRandom();
})

$("#restore").click(function(){
   restore();
})

现场演示：http://jsfiddle.net/g4Q8B/

如何选择保存删除选项的最佳方法？我不想使用hide，display：none等，因为这不适用于所有浏览器。我也不想使用残疾人。

我想删除它，下一个或上一个保存所有选项。也许我应该保存所有选择＃sel，但是如何？

Answer 1

最佳方法是在页面加载时存储选项的克隆。然后克隆该克隆以进行恢复，因此您始终将第一个克隆保留为缓存。

var $options=$('#sel option').clone();

function restore(){
 $('#sel').html( $options.clone()) 
}

的 DEMO

现在，如果你想对选项进行任何过滤，也可以在缓存上进行，你总是存储全套

$('#filtered').click(function(){ /* only options with value > 3*/ var opts=$options.clone().filter(function(){ return this.value > 3; }) $('#sel').html(opts) })

从select中删除和恢复选项

1 个答案: