<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
select { height:200px;
width:100px;
}
</style>
</head>
<body>
<select multiple>
<option value="4">Opcion 4</option>
<option value="2">opcion 2</option>
<option value="6">opcion 6</option>
<option value="7">opcion 7</option>
<option value="1">opcion 1</option>
<option value="3">opcion 3</option>
<option value="5">opcion 5</option>
</select>
<input type="button" onclick="ordenar('select')" value="Ordenar">
</body>
</html>
<script>
/**
* Función para ordenar los elementos de un select
*
* @param string select - texto que haya referencia al select con la
* funcion querySelector()
* Puede ser por:
* tag del formulario "form"
* nombre del formulario "form[name=nombreForm]"
* id del formuario "#idForm"
*/
function ordenar(select) { s=document.querySelector(select);
Array.from(s.options).sort(
(a,b) => a.text.toLowerCase() > b.text.toLowerCase() ? 1: -1
).forEach(
el => s.add(el)
);
}
</script>
