0

選択ボックスのテキストフィールドにあるものを追加する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で選択した要素までスクロールするコードを見つけましたが、選択されているものに関係なく、単にリストの最後までスクロールするコードが見つかりませんでした。最初の要素を選択すると、このコードはスクロールしないので、これが必要です!

4

1 に答える 1

0

これを試して:

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.');
        }
    }
};
于 2012-12-25T20:56:38.520 に答える