我想要实现的事情是，每当<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。
当前回答
我想为解决这个问题贡献另一种选择;因为上面提出的解决方案并没有解决我的情况。
(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中进行调整。(在body中添加监听器，检查原始目标是否为select, execute函数，…)
通过将更改侦听器附加到主体，您几乎可以确定它将在特定的侦听器之后触发选择，否则'data-previous'的值将在您甚至可以读取它之前被覆盖。
当然，这是假设您更喜欢为set-previous和check-value使用单独的侦听器。它正好符合单一责任模式。
注意:这将把“先前”功能添加到所有选择中，所以如果需要，请确保对选择器进行微调。
其他回答
在编写下拉“on change”动作函数之前，将当前选中的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;
}
});
});
手动跟踪值。
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;
});
});
将它存储在一个self属性中(在文档就绪时):
$('#myselect').attr('orig',$('#myselect').val());
然后与变化后的值进行比较:
if ($('#myselect').attr('orig')!=$('#myselect').val()) ...
有几种方法可以达到你想要的结果，以下是我的拙见:
让元素保持之前的值，因此添加属性'previousValue'。
<select id="mySelect" previousValue=""></select>
初始化后，'previousValue'现在可以用作属性。在JS中，要访问这个select的previousValue:
$("#mySelect").change(function() {console.log($(this).attr('previousValue'));.....; $(this).attr('previousValue', this.value);}
使用'previousValue'后，将属性更新为当前值。
最好的解决办法:
$('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);
});
