Question

我在jQuery中有一个函数，它在选择框的文本字段中添加了什么。单击按钮时调用该函数：

        addToList = function(textField, selectList)
    {
           var val = $('#'+textField).val();
           var select = $('#'+selectList);

           //If element does not exist already...
           if (select.find('option[value="' + val + '"]').length === 0 && val!="") 
           {
               //Add new element to the list
               $('<option>', {
                 value: val,
                 text: val
                 }).appendTo(select);

               //Clear text field
               $('#'+textField).val("");

               //Scroll down multi select and select automatically the added option
               //TODO: Scrolls only to selected element
                var lastOption = select.find("option[value="+val+"]");
                lastOption.attr("selected", true);             
           }
           else
           {
               if (val!="")
                {
                    alert("\""+val+"\" is already in the list.");
                }   
           }
    };

我想要的是，每次我向列表添加一个元素时，列表向下滚动到它的底部（这意味着列表的最后一个元素将在其最后一行显示）并且添加的元素将是自动选择。

我在SO上找到了一些向下滚动到所选元素的代码，但是我发现没有代码可以简单地滚动到列表的末尾，无论选择了什么。我需要这个，因为如果我选择第一个元素，这段代码就不会滚动了！

Answer 1

试试这个：

var addToList = function(textField, selectList) {
    var $textField = $('#' + textField),
        $select = $('#' + selectList),
        val = $textField.val(),
        valueFilter = '[value="%s"]';
    if(val) {
        if($select.find('option').filter(valueFilter.replace('%s',val)).length === 0) {
            $('<option/>').appendTo($select).attr('value', val).text(val);
            $textField.val('');
            $select.val(val);//<<<<<<<<<<<<
        }
        else {
            alert('"' + val + '" is already in the list.');
        }
    }
};

使用jQuery滚动到多选的最后一个元素

1 个答案: