Materialize CSS select: Get selected value when close

问题

Trying to get selected value on Materialize CSS select element at close.

Something like this:

$('input.select-dropdown').on('close', function() {
    console.log($(this).val());
});

just doesn't work, because shows last selected value. First time shows nothing, and next time shows selected value first time.

I supose this is because close action is declared before asign selected value.

Anyone knows if there is any way to get selected value on "close"?

Thanks in advance.

UPDATE

I don't want to select value by jquery, I want to detect selected value (if any option has been selected) when dropdown close.

I'm trying to implement label funcionality for select as for text input: when select is opened, label goes smaller, and when select is closed, if no value is selected, returns to initial position.

回答1:

Try

$(document).on('change', 'input.select-dropdown', function() {
    console.log($(this).val());
});

回答2:

Finally, I just add a different class to label when element in dropdown is clicked.

With this two classes ("active" from Materialize framework and "forced" asigned on selecting element) I can do what I want, label for select working like label of text input :)

回答3:

Use mouse down event.

$('input.select-dropdown').on('mousedown', function() {
    console.log($(this).val());
});

Or you can try with change event. here:

$('input.select-dropdown').on('change', function() {
        console.log($(this).val());
    });

来源：https://stackoverflow.com/questions/45304257/materialize-css-select-get-selected-value-when-close

标签

jquery

materialize