Добавить <select>параметров, основанных на значении ввода текста

Question

Как добавить параметры в поле выбора в зависимости от значения ввода текста?

Это мой вводимый текст:

<input type="text" id="amount" size="30" />

Это мой элемент, к которому я хочу добавить:

<span id="span_combo">
     <select name="foo" id="combo">
           <option value="1">1</option>  
           <option value="2">2</option>
     </select>
</span>

Это мой текущий JS:

$("#amount").keyup(function(){
        var flag;
        $("#combo").show("slow");
        var a = $("#amount").val();
        if(a==""){
            $("#span_combo select").remove(true);
        }
        var i;
        for(i=1;i<=a-1;i++){
                $("#span_combo").append($("#span_combo select").first().clone(true));
        }
    });

Answer 1

Что-то вроде этого должно сделать это

Демонстрация в режиме реального времени здесь: http://jsfiddle.net/NdpuM/1/

$("#amount").keyup(function(){
    var $combo = $('#combo');
    $combo.html('');
    var value = parseInt($('#amount').val(), 10);
    for (i = 1; i <= value; i++) {
        var $option = $('<option>').val(i).html(i);
        $combo.append($option);
    }
});

По сути, снимайте флажок выбора каждый раз, когда появляется клавиша и снова заполняйте ее.Вы могли бы оптимизировать это больше, добавив несколько проверок, чтобы увидеть, является ли это то же самое значение

Answer 2

Если вы хотите перестроить весь массив:

$("#amount").keyup(function(){
        $("#combo").show("slow");
        var a = $("#amount").val();
        if(a==""){
            $("#span_combo select").remove(true);
        }


        $('#combo').empty();
        for(var i=1;i<=a-1;i++){
            $('<option />').attr('value', i)
                           .text(i)
                           .appendTo($('#combo'));
        }
    });

Answer 3

Я думаю, что это может сработать:

$("#amount").keyup(function() {
        var current = $("#combo option").length;
        if(current < $(this).val()) {
            for(var i = current + 1;i<=$(this).val();i++) {
                $("#combo").append('<option value="'+i+'">'+i+'</option>');
            }
        } else {
            for(var i=(parseInt($(this).val(),10)+1);i<=current;i++) {
                $('#combo option[value="'+i+'"]').remove();
            }
        }
    });

Возможно, вы захотите добавить проверку ввода для этой функции, но она делает то, что вам нужно, если вы правильно ее используете.

РЕДАКТИРОВАТЬ: просто чтобы уточнить, этот код не очищает весь блок выбора при каждом событии keyup, он просто добавляет новые параметры или удаляет последние, чтобы получить указанное количество значений.