Получение значения select (выпадающего) до изменения

Question

То, чего я хочу достичь, - это когда всякий раз, когда меняется выпадающий список <select>, я хочу, чтобы значение выпадающего списка было перед изменением.Я использую версию 1.3.2 jquery и использую событие change, но значение, которое я получаю, остается после изменения.

<select name="test">
<option value="stack">Stack</option>
<option value="overflow">Overflow</option>
<option value="my">My</option>
<option value="question">Question</option>
</select>

Допустим, в настоящее время опция My выбрана, когда я изменяю ее на стексобытие onchange (т. е. когда я изменил его на стек), я хочу, чтобы это было предыдущее значение, т.е. мое ожидание в этом случае.

Как этого достичь?

Редактировать: В моем случае у меня есть несколько полей выбора на одной странице, и я хочу, чтобы ко всем из них применялась одна и та же вещь.Также все мои выбранные вставляются после загрузки страницы через ajax.

Answer 1

Лучшее решение:

$('select').on('selectric-before-change', function (event, element, selectric) {
    var current = element.state.currValue; // index of current value before select a new one
    var selected = element.state.selectedIdx; // index of value that will be selected

    // choose what you need
    console.log(element.items[current].value);
    console.log(element.items[current].text);
    console.log(element.items[current].slug);
});

Answer 2

Это улучшение ответа @thisisboris. Он добавляет текущее значение к данным, поэтому код может контролировать изменение переменной, установленной на текущее значение.

(function()
{
    // Initialize the previous-attribute
    var selects = $( 'select' );
    $.each( selects, function( index, myValue ) {
        $( myValue ).data( 'mgc-previous', myValue.value );
        $( myValue ).data( 'mgc-current', myValue.value );  
    });

    // Listen on the body for changes to selects
    $('body').on('change', 'select',
        function()
        {
            alert('I am a body alert');
            $(this).data('mgc-previous', $(this).data( 'mgc-current' ) );
            $(this).data('mgc-current', $(this).val() );
        }
    );
})();

Answer 3

Я хотел бы предложить еще один вариант решения этой проблемы;поскольку предложенные выше решения не решили мой сценарий.

(function()
    {
      // Initialize the previous-attribute
      var selects = $('select');
      selects.data('previous', selects.val());

      // Listen on the body for changes to selects
      $('body').on('change', 'select',
        function()
        {
          $(this).data('previous', $(this).val());
        }
      );
    }
)();

При этом используется jQuery, так что def.здесь есть зависимость, но она может быть адаптирована для работы в чистом JavaScript.(Добавьте слушателя к телу, проверьте, была ли исходная цель выбором, выполнить функцию, ...).

Прикрепив слушателя изменений к телу, вы можете быть уверены, что это сработает после определенных прослушивателей для выборок, в противном случае значение «data-previous» будет перезаписано, прежде чем вы сможете его даже прочитать.

Это, конечно, при условии, что вы предпочитаете использовать отдельных прослушивателейваш предыдущий набор и проверочное значение.Он отлично сочетается с шаблоном с единственной ответственностью.

Примечание: Это добавляет эту «предыдущую» функциональность к всем выборкам, поэтому не забудьте точно настроитьселекторы при необходимости.

Answer 4

(function() {

    var value = $('[name=request_status]').change(function() {
        if (confirm('You are about to update the status of this request, please confirm')) {
            $(this).closest('form').submit(); // submit the form
        }else {
            $(this).val(value); // set the value back
        }
    }).val();
})();

Answer 5

Используйте следующий код, я проверил его и его работу

var prev_val;
$('.dropdown').focus(function() {
    prev_val = $(this).val();
}).change(function(){
            $(this).unbind('focus');
            var conf = confirm('Are you sure want to change status ?');

            if(conf == true){
                //your code
            }
            else{
                $(this).val(prev_val);
                $(this).bind('focus');
                return false;
            }
});

Answer 6

Ну, почему бы вам не сохранить текущее выбранное значение, и когда выбранный элемент будет изменен, у вас будет сохранено старое значение? (и вы можете обновить его снова, как пожелаете)