获取在用户选择新单选按钮之前选择的单选按钮的值

Question

如果我有3个单选按钮，有没有办法在用户单击新按钮之前通过jQuery找出选中的单选按钮的值？

<div id="radio-group">
    <input type="radio" id="radio-1" name="radios" value="1" checked="true" />
    <input type="radio" id="radio-2" name="radios" value="2" />
    <input type="radio" id="radio-3" name="radios" value="3" />
</div>

在示例avove中，如果用户单击radio-3，我需要一种方法来获取1，这样我就可以对其进行一些格式化。谢谢。

Answer 1

我会将按下的值保存到一个数组中，并用它来编辑隐藏值。

http://jsfiddle.net/BQDdJ/6/

HTML

<div id="radio-group">
    <input type="radio" id="radio-1" name="radios" value="1" checked="true" />
    <input type="radio" id="radio-2" name="radios" value="2" />
    <input type="radio" id="radio-3" name="radios" value="3" />
    <input type="hidden" id="radio-previous" name="radio-previous" />
</div>​

JavaScript

$(document).ready(function(){
    var clicks = new Array();
    clicks[0] = 1 //this should be the default value, if there is one

    $('input[name$="radios"]').change(function(){
       clicks.push($(this).val()) 
       $('#radio-previous').val(clicks[clicks.length-2])
    })
})

​

Answer 2

您可以使用mouseup和change事件。在鼠标打开时，你将获得在选择其他单选按钮之前选择的radio按钮的值，而change事件将给出新的radio按钮选择。

$('input[name=radios]').mouseup(function(){
    alert("Before change "+$('input[name=radios]:checked').val());
}).change(function(){
    alert("After change "+$('input[name=radios]:checked').val());
})​;

Answer 3

“已经有一段时间了”可能是一种委婉语，但如果有人偶然发现了这个问题：

Adil给我指出了正确的方向，但是mouseup只适用于鼠标触发的事件(duh)，所以我尝试了使用focus，因为它也发生在change事件之前，所以它适用于鼠标和键盘输入(比如当您使用标签和箭头键更改无线电状态时)。因此，要在用户交互之前访问以前选择/选中的项目，请使用focus；要获取当前项目，请使用旧的change

//html
    <input type="radio" id="radio-1" name="radios" value="1" />
    <input type="radio" id="radio-2" name="radios" value="2" />

//js
    //if currently checked item is radio-1
    $('[name=radios]').on('focus', function() {
        console.log($('[name="radios"]:checked').val()); //outputs 1
    });
    $('[name=radios]').change(function() {
        console.log($('[name="radios"]:checked').val()); //outputs 2
    });