Auto select <option> added to <select>

Question

I add "option"s to "select" with javascript or jquery.

I would like to select last added and scroll the scrollbar to most bottom.

i add text like this

function ConsoleOutputAdd(text){
    var content = '<option>'+ text +'</option>';
    $consoleoutput.append(content); 
}

this is the select element.

<select id="consoleoutput" size="4">></select>

i think it would be with onchanged event but i cant think anything more.

thank you

Answer 1

$('#consoleoutput').find('option:last').prop('selected', true ); 

这是一个小提琴

Answer 2

You can select the last item in the list like so:

var sel = document.getElementById('consoleoutput');
sel.selectedIndex = sel.options.length - 1;

Answer 3

1: write an on-change listener to your select element

$('#consoleoutput').change(function(){
   // scroll
})

2: add this to select the option you have added:

$("#consoleoutput").val(text);