我想要实现的事情是,每当<select>下拉菜单被更改时,我想要更改前的下拉菜单的值。我使用1.3.2版本的jQuery和使用的变化事件,但我在那里得到的值是变化后。
<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。
如何使用一个自定义的jQuery事件与角手表类型的接口;
// 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
});