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

<p>единственное, чего я хочу добиться, - это чтобы каждый раз, когда менялся раскрывающийся список <code><select></code>, я хотел получить значение раскрывающегося списка перед изменением. я использую версию 1.3.2 jquery и использую событие change, но значение, которое я получаю, остается после изменения.</p><pre><code><select name="test"> <option value="stack">stack</option> <option value="overflow">overflow</option> <option value="my">my</option> <option value="question">question</option> </select> </code></pre><p>допустим, в настоящее время опция my выбрана сейчас, когда я изменяю ее на стек в событии onchange (то есть, когда я меняю ее на стек), я хочу, чтобы это было предыдущее значение, т.е. мое ожидание в этом случае.</p><p>как этого достичь?</p><p><strong> правка: </strong>в моем случае у меня есть несколько полей выбора на одной странице и хочу, чтобы ко всем из них применялась одна и та же вещь. также все мои выбранные вставляются после загрузки страницы через ajax.</p>

<p>объедините событие <em>focus</em> с событием <em>change</em>, чтобы достичь желаемого:</p><pre><code>(function () { var previous; $("select").on('focus', function () { // store the current value on focus and on change previous = this.value; }).change(function() { // do something with the previous value after the change alert(previous); // make sure the previous value is updated previous = this.value; }); })(); рабочий пример: <a href="http://jsfiddle.net/x5pkf/766">http://jsfiddle.net/x5pkf/766 

пожалуйста, не используйте глобальную переменную для этого - сохраните значение prev в данных вот пример: <a href="http://jsbin.com/uqupu3/2/edit">http://jsbin.com/uqupu3/2/edit код для ссылки:$(document).ready(function(){ var sel = $("#sel"); sel.data("prev",sel.val()); sel.change(function(data){ var jqthis = $(this); alert(jqthis.data("prev")); jqthis.data("prev",jqthis.val()); }); }); </code></pre><p>только что увидел, что у вас есть много выборок на странице - этот подход также будет работать для вас, так как для каждого выбора вы будете сохранять предыдущее значение в данных выбора</p>

<p>я использую решение avi pinto, которое использует <code>jquery.data()</code></p><p>использование фокуса не является правильным решением. он работает при первом изменении параметров, но если вы останетесь на этом элементе выбора и нажмете клавишу «вверх» или «вниз». это не будет проходить через событие фокуса снова.</p><p>таким образом, решение должно быть больше похоже на следующее, </p><pre><code>//set the pre data, usually needed after you initialize the select element $('myselect').data('pre', $(this).val()); $('myselect').change(function(e){ var before_change = $(this).data('pre');//get the pre data //do your work here $(this).data('pre', $(this).val());//update the pre data }) </code></pre>

<p>отслеживайте значение вручную.</p><pre><code>var selects = jquery("select.track\_me"); selects.each(function (i, element) { var select = jquery(element); var previousvalue = select.val(); select.bind("change", function () { var currentvalue = select.val(); // use currentvalue and previousvalue // ... previousvalue = currentvalue; }); }); </code></pre>

<pre><code> $("#dropdownid").on('focus', function () { var ddl = $(this); ddl.data('previous', ddl.val()); }).on('change', function () { var ddl = $(this); var previous = ddl.data('previous'); ddl.data('previous', ddl.val()); }); 

я использую событие «live», мое решение в основном похоже на dimitar, но вместо «focus» мое предыдущее значение сохраняется при срабатывании «click». var previous = "initial prev value"; $("select").live('click', function () { //update previous value previous = $(this).val(); }).change(function() { alert(previous); //i have previous value }); 

я знаю, что это старая ветка, но подумал, что могу добавить немного больше. в моем случае я хотел передать текст, val и некоторые другие данные. в этом случае лучше хранить весь параметр как предыдущее значение, а не только значение val.пример кода ниже:var $sel = $('your select'); $sel.data("prevsel", $sel.clone()); $sel.on('change', function () { //grab previous select var prevsel = $(this).data("prevsel"); //do what you want with the previous select var prevval = prevsel.val(); var prevtext = prevsel.text(); alert("option value - " + prevval + " option text - " + prevtext) //reset prev val $(this).data("prevsel", $(this).clone()); }); <strong> правка: </strong>я забыл добавить .clone () на элемент. не делая этого, когда вы пытаетесь вернуть значения, вы в конечном итоге получаете новую копию выбора, а не предыдущую. использование метода clone () сохраняет копию выбора вместо его экземпляра.

сохраните текущее выбранное выпадающее значение с выбранным jquery в глобальной переменной перед тем, как написать выпадающую функцию действия «при изменении». если вы хотите установить предыдущее значение в функции, вы можете использовать глобальную переменную.//global variable var previousvalue=$("#dropdownlist").val(); $("#dropdownlist").change(function () { bootstrapdialog.confirm(' are you sure you want to continue?', function (result) { if (result) { return true; } else { $("#dropdownlist").val(previousvalue).trigger('chosen:updated'); return false; } }); }); </code></pre>

<p>как насчет использования пользовательского события jquery с угловым интерфейсом типа часов;</p><pre><code>// adds a custom jquery event which gives the previous and current values of an input on change (function ($) { // new event type tl_change jquery.event.special.tl_change = { add: function (handleobj) { // use mousedown and touchstart so that if you stay focused on the // element and keep changing it, it continues to update the prev val $(this) .on('mousedown.tl\_change touchstart.tl\_change', handleobj.selector, focushandler) .on('change.tl\_change', handleobj.selector, function (e) { // use an anonymous funciton here so we have access to the // original handle object to call the handler with our args var $el = $(this); // call our handle function, passing in the event, the previous and current vals // override the change event name to our name e.type = "tl\_change"; handleobj.handler.apply($el, [e, $el.data('tl-previous-val'), $el.val()]); }); }, remove: function (handleobj) { $(this) .off('mousedown.tl\_change touchstart.tl\_change', handleobj.selector, focushandler) .off('change.tl\_change', handleobj.selector) .removedata('tl-previous-val'); } }; // on focus lets set the previous value of the element to a data attr function focushandler(e) { var $el = $(this); $el.data('tl-previous-val', $el.val()); } })(jquery); // usage $('.some-element').on('tl_change', '.delegate-maybe', function (e, prev, current) { console.log(e); // regular event object console.log(prev); // previous value of input (before change) console.log(current); // current value of input (after change) console.log(this); // element }); 

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

(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(); })(); </code></pre>

<p>используйте следующий код, я проверил его и его работу</p><pre><code>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; } }); 

есть несколько способов достичь желаемого результата, это мой скромный способ сделать это:пусть элемент содержит свое предыдущее значение, поэтому добавьте атрибут «previousvalue».<select id="myselect" previousvalue=""></select> после инициализации «previousvalue» теперь можно использовать в качестве атрибута. в js для доступа к предыдущему значению этого выберите:$("#myselect").change(function() {console.log($(this).attr('previousvalue'));.....; $(this).attr('previousvalue', this.value);} </code></pre><p>после того, как вы закончили использовать 'previousvalue', обновите атрибут до текущего значения.</p>

<p>лучшее решение:</p><pre><code>$('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); }); 

это улучшение ответа @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() ); } ); })(); </code></pre>