在更改之前获取所选选项
get selected option before onchange
我有一个这样的选择标签
<select class="selecttag" onchange="onchangeEvent()">
<option value="1">value1</option>
<option value="2">value2</option>
<option value="3">value3</option>
<option value="4">value4</option>
</select>
如何在更改事件之前获得选择的选项?
可以将元素数据中的值存储在focus
事件中。
例如:
$('.selecttag').on('focus', function(){
$(this).data("value", $(this).val());
})
然后在更改事件中,您可以取回data("value")
。
例如
$('.selecttag').on('change', function(){
var orig = $(this).data("value");
var newVal = $(this).val();
// Save the newer value
$(this).data("value", $(this).val());
// Do something with both values!
});
笔记:
- 我只在上面使用jQuery事件处理程序,并建议您不要将
inline
事件处理程序与jQuery混合使用。这样可以避免将事件注册与事件处理程序分开,并启用 jQuery 提供的额外事件功能。 - 使用 jQuery 处理程序也可以将它们链接起来:
例如
$('.selecttag').on('focus', function(){
$(this).data("value", $(this).val());
}).on('change', function(){
var orig = $(this).data("value");
var newVal = $(this).val();
// Save the newer value
$(this).data("value", $(this).val());
// Do something with both values!
});
第一次之后焦点实际上是多余的,所以你可以只做一次,像这样:
$('.selecttag').one('focus', function(){
$(this).data("value", $(this).val());
}).on('change', function(){
var orig = $(this).data("value");
var newVal = $(this).val();
// Save the newer value
$(this).data("value", $(this).val());
// Do something with both values!
});
在 var 中设置以前的值,并在更改时更新它。您的onchange
应该在 JS 中进行管理:
var prev = $("#select").val();
$("#select").on("change", onchangeEvent);
function onchangeEvent() {
var curr = $("#select").val();
console.log("Prev: " + prev, "Current: " + curr);
prev = curr;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="select" class="selecttag">
<option value="1">value1</option>
<option value="2">value2</option>
<option value="3">value3</option>
<option value="4">value4</option>
</select>
我会在做这样的事情之前获取#selecttag
的当前值:
$(document).ready(function(){
var selected = $(".selecttag option:selected");
// do whatever after this
});
您可以使用 jQuery 来获取值。
$( "#selecttag" ).val();
相关文章:
- 使用Javascript获取所选选项ID
- 活动选项卡's源代码-获取变量s值
- 如何从选择框中的选项中获取属性值
- 正在获取所选选项数据
- Jquery:如何获取所选选项全文(带空格)
- 使用JavaScript在IE9中获取数据列表选项
- 如何在不需要单击按钮的情况下获取选项的值
- 如何在jquery.easytabs.js中获取当前选项卡
- AngularJS ng选项获取索引
- 在选择中从上一个选项获取数据,从当前选项获取数据
- 使用此值选择选项获取脚本
- 如何使用JavaScript将选中的选项获取为选择下拉标签
- 使用选择选项获取行平均值
- 从multiselect中的选定选项获取属性值
- 使用JQUERY通过文本选择选项获取值
- 从AngularJS中的选定选项获取值
- 我正在尝试使用表单选择选项获取当前日期,并在提交时显示接下来的七天
- 自动填充空值在ng模型中,从ng选项获取数据
- 验证下拉列表以根据所选选项获取正确的日期
- 如何从所选选项获取文本