Question

是否可以使用下拉控制功能，如果下拉列表中没有任何元素我感兴趣，我可以自己键入它？

感谢您的帮助

Answer 1

免责声明：我知道此问题尚未标记jQuery，但对于未来的搜索用户，我将为jquery解决方案提供一个开始。

这是一个非常简单的jQuery插件开始，它允许动态选项进入选择框。为每个select元素添加一个额外的文本框和按钮到DOM。此外，选项列表底部还会添加一个选项，其中包含“添加项目...”等文本。选中此选项后，用户可以在其中键入新项目并将其添加到选择框中。

此处的实例：http://jsfiddle.net/8G6z3/1/

(function($) {


    $.fn.freeEntry= function(options){

        var settings = $.extend(
             {},
             {  //defaults
                 addItemText: 'add item...'
             },
             options
          );

        return this.each(function(){

            var $this = $(this);

            var $addItemOption = $('<option>' + settings.addItemText + '</option>');
            $this.append($addItemOption);

            var $addItemControl = $('<input type=text>').hide();
            $addItemControl.insertAfter($this);
            var $addItemButton = $('<input type=button value="add">').hide();
            $addItemButton.insertAfter($addItemControl);
            $addItemButton.click(function(){
                if($addItemControl.val().length){
                     var $newOption = $('<option>' + $addItemControl.val() + '</option>');  
                    $newOption.insertBefore('option:last',$this)
                    $this.val($addItemControl.val());
                    $addItemControl.val('');                
                }
                $addItemControl.hide();
                $addItemButton.hide();
            });

            $this.change(function(){
               var $this = $(this);
                if($this.val() == settings.addItemText){
                     $addItemControl.show().focus();
                    $addItemButton.show();
                }
            });
        });
    }

})(jQuery);

用法：$('#mySelectBox').freeEntry( { addItemText: "Add a new item yo!"} );

Answer 2

使用标准HTML select控件无法做到这一点，但您可以使用HTML input文本框，该文本框使用AJAX自动完成功能显示下拉列表：

http://www.devbridge.com/projects/autocomplete/jquery/

或者，您可以在HTML select下拉列表中选择“其他”选项，选中后会显示TextBox控件

Answer 3

您可以在下拉列表附近放置一个文本框，其中包含一个将html附加到列表部分的提交按钮吗？

下拉列表，可选择添加新元素

3 个答案: