输入文本字段,在jquery中用逗号分隔

时间:2011-04-03 11:38:15

标签: jquery input key

我尝试手动创建输入文本字段用于写入文本或从列表中选择(通过输入)。 但我的解决方案并不完美。 当我进入并书写时,它是有效的。 当我向上/向下使用箭头以在现场显示时不起作用。怎么做?

$(document).keyup(function(e){
        var $hlight = $('li.hlight'), $el = $('li');

        if (e.keyCode == 40) {
            $hlight.removeClass('hlight').next().addClass('hlight');

            if ($hlight.next().length == 0) {
                $el.eq(0).addClass('hlight')
            }

            $('input[type=text]').val($('input[type=text]').val() + ($('li.hlight').text()));

        } else if (e.keyCode === 38) {
            $hlight.removeClass('hlight').prev().addClass('hlight');

            if ($hlight.prev().length == 0) {
                $el.eq(-1).addClass('hlight')
            }

            $('input[type=text]').val($('input[type=text]').val() + ($('li.hlight').text()));
        }           

        if (e.keyCode == 13) {
            //alert('enter');
            $('input[type=text]').val($('input[type=text]').val() + ', ');
        }
    });

1 个答案:

答案 0 :(得分:0)

我创建了一些代码,例如自动完成/建议插件:

$(document).keydown(function(e){ //klawisz
        $('#search').val($('#search').val().replace(/[^a-z]/, '')); 

        $.post('rpc.php', {queryString: ""+$('#search').val()+""}, function(data) {
            if (data.length > 0) {                  
                $('#suggest').show().html(data);
            }
        });
    });

    var arr = new Array();

    $(document).keyup(function(e){ // strzalka  
        //alert('strzałka');

        var $hlight = $('#suggest li.hlight'), $el = $('#suggest li');

        if (e.keyCode == 40) {
            $hlight.removeClass('hlight').next().addClass('hlight');

            if ($hlight.next().length == 0) {
                $el.eq(0).addClass('hlight')
            }

            $('#search').val($('li.hlight').text());

        } else if (e.keyCode === 38) {
            $hlight.removeClass('hlight').prev().addClass('hlight');

            if ($hlight.prev().length == 0) {
                $el.eq(-1).addClass('hlight');
            }

            $('#search]').val($('li.hlight').text());
        }

        if ((e.keyCode == 13 || e.keyCode == 188) && $('#search').val().length > 0) {
            if (arr.indexOf($('#search').val()) === -1) {                   
                $('#search').val($('#search').val().replace(/\,/i, '')); 

                arr.push($('#search').val());
            }               

            $('#search').val('');
            $('#suggest').hide();

        }

        $('#tags').html(''+arr);
    });

一切正常......但是当我使用箭头(向下或向上)并从列表中选择时,单词copy to input和in list只留下这一个单词。 我想滚动列表,但仍显示所有建议词