使用 jquery 根据输入文本框更改并显示[删除/添加]可用选项

Question

 <input id="studentnoofinst" type="text" size="20" value=""/>
<select id="studentinst" size="6">
<option value="1">First Installment</option>
<option value="2">Second Installment</option>
<option value="3">Third Installment</option>
<option value="4">Fourth Installment</option>
<option value="5">Fifth Installment</option>
<option value="6">Sixth Installment</option>
</select>

Jquery

 $("#studentnoofinst").keyup(function() { 

    //$("select option[value='fb']").prop("selected",true);
    alert("going to change");
    $leap=0;
    $leap=($('#studentnoofinst').val());
    if($leap!=''){
    for(i=$leap;i<=6;i++) {// displaying the no of installments 
        if(i!=$leap){
            $('#studentinst option[value='+i+']').remove();

 }
     }    
    }

});

嗨，如上面的代码所示，我能够删除所选的行，我的问题是我无法将所选的选项添加回来，如何将所选的行添加回来 PS：一旦输入4，最后2行将被删除，稍后如果输入5，仅显示前4行，第5行被删除..但

如果第一次输入= 4

则需要它输出：

  <option value="1">First Installment</option>
  <option value="2">Second Installment</option>
  <option value="3">Third Installment</option>
  <option value="4">Fourth Installment</option>

如果第二次输入=5

输出：

  <option value="1">First Installment</option>
  <option value="2">Second Installment</option>
  <option value="3">Third Installment</option>
  <option value="4">Fourth Installment</option>
  <option value="5">Fifth Installment</option>//vomitted but i need this? add

此处为实例：http://jsfiddle.net/PQ7GF/30/

Answer 1

编辑 - 合并灵魂所做的更改：

您可以将选项保存在变量中并将它们添加回来：

var list = $('#studentinst').html();
$("#studentnoofinst").keyup(function() {
    $('#studentinst').empty().append(list);
    alert("going to change");
    $leap = 0;
    $leap = ($('#studentnoofinst').val());
    if ($leap != '') {
        for (i = $leap; i <= 6; i++) { // displaying the no of installments 
            if (i != $leap) {
                $('#studentinst option[value=' + i + ']').remove();
            }
        }
    }
});

在这里小提琴： http ://jsfiddle.net/PQ7GF/49/

Answer 2

一旦删除，就删除了！

如果您只想移动一行，您可以查看 jQuery 的 before、after 和append 函数。

如果您想临时删除一行并稍后插入，您应该使用分离。

如果您想隐藏它并稍后再次显示，您应该使用隐藏和显示功能。

前往 jQuery 文档 并查找这些函数以了解哪些函数适合。

这是一个带有 detach() 的小提琴，当重新插入同一元素时，这会保持所有其他数据完好无损： http://jsfiddle .net/PQ7GF/50/