sucede que al momento de querer abrir una lista desplegable de Materialize V0.100.2 en Google Chrome, no se despliega correctamente y es necesario hacer dos o más click para poder ver las opciones correctamente.
Algunas veces funciona haciendo un solo click, otras no, y por eso estoy confundido y no se cual sea una posible solución. Intenté aplicando e.preventDefault(); al evento mouseup y mousedown, pero no funcionó:
$(document).ready(function() {
$('select').material_select();
$('.select-dropdown').on('mousedown', function(e) {
console.log('Se clickeó el mouse');
$('.select-dropdown').on('mouseup', function(e) {
console.log('Se soltó el mouse');
console.log('*****************');
});
});
});
<!--Import Google Icon Font-->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<!-- Compiled and minified CSS -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<!-- Compiled and minified JavaScript -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/js/materialize.min.js"></script>
<div class="container">
<div class="row">
<div class="input-field col s3">
<select id="selectEstadoNotificacion">
<option value="" selected="selected">Todos</option>
<option value="done">Exito</option>
<option value="failed">Fallido</option>
</select>
<label>Estado</label>
</div>
<div class="input-field col s3">
<select id="jsChannelNotification">
<option value="" selected="selected">Otro</option>
<option value="done">Uno</option>
<option value="failed">Dos</option>
</select>
<label>Medio</label>
</div>
</div>
</div>