我想检测从select元素中取消选项的事件。例如,如果我的HTML是:
<select id="select_box">
<option value="1">Hot</option>
<option value="2">Cold</option>
<option value="3">Just Right</option>
</select>
选择第二个选项(value="2"
),然后用户通过单击其他选项(例如value="3"
)或再次单击相同选项取消选择它,如何检测那个事件使用jQuery?我的目标是在它发生时启动它。
我尝试了以下内容:
$("#select_box option:selected").change(function() {
console.log($(this).val());
});
但它不起作用。
答案 0 :(得分:3)
change
事件应该放在select
元素本身上:
$("#select_box").change(function() {
console.log($(this).val());
});
当select的值发生变化并且与您需要的行为相匹配时,将触发此事件。
我想要取消选择的选项的值。
在这种情况下,您需要在选择之前存储先前的值,如下所示:
$("#select_box").change(function() {
var $select = $(this),
currentValue = $select.val(),
oldValue = $select.data('previous-value');
// do stuff...
$select.data('previous-value', currentValue);
});
答案 1 :(得分:1)
嗯,这就是我用改变事件监听器处理这个问题的方法。
$("#select_box").on('change', function(e){
var $t = $(this), data = $t.data('last') || {optText:'none', val:'none'};
$t.next().text('last was ['+data.optText+'] and its value is "'+data.val+'"').end()
.data('last', {optText:$t.children('[value="'+$t.val()+'"]').text(), val:$t.val()});
});
小提琴HERE
答案 2 :(得分:0)
使用one()
事件绑定方法
答案 3 :(得分:0)
只有在您需要更改值时才会触发更改事件
$("#select_box").change(function() {
console.log(this.value);
});
答案 4 :(得分:0)
您可以手动执行某些操作,例如我给出的代码,
var xSelectedOption = 0;
$("#select_box").change(function() {
if(xSelectedOption != $(this).val())
{
xSelectedOption = $(this).val();
console.log("Option was changed!");
}
});