根据定位运行不同的功能

Question

所以基本上我有两个功能。如果我检查之前 当前选中的单选按钮，则会运行第一个功能。如果我检查 >当前选中的单选按钮，第二个功能就会运行。怎么可以这样做？

<input type="radio" id="a" name="radio">
<label for="a">A</label>

<input type="radio" id="b" name="radio" checked>
<label for="b">B</label>

<input type="radio" id="c" name="radio">
<label for="c">C</label>

<input type="radio" id="d" name="radio">
<label for="d">D</label>  



  $("input[name='radio']").change(function(){

    if {
    // do something
    }

    if {
    // do something
    }

  });

Answer 1

检查之前输入的index，如果它少于触发之前的功能，否则触发之后。然后将当前索引重置为现在索引。

＆＃13;

＆＃13;

var currentIndex = $("input[name='radio']:checked").index('input');
$("input[name='radio']").change(function() {
  var index = $(this).index('input');
  if (index < currentIndex) {
    console.log('before');
  } else {
    console.log('after');
  }
  currentIndex = index;
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="radio" id="a" name="radio">
<label for="a">A</label>

<input type="radio" id="b" name="radio" checked>
<label for="b">B</label>

<input type="radio" id="c" name="radio">
<label for="c">C</label>

<input type="radio" id="d" name="radio">
<label for="d">D</label>

＆＃13;

＆＃13;

＆＃13;

Answer 2

如其中一条评论中所述，跟踪索引。 存储与已更改复选框的索引

匹配的var

var cindex = $('input[name=radio]:checked').index('input');
$("input[name='radio']").change(function(){
   var thisindex = $(this).index('input');
   if ( thisindex < cindex ) {
       // clicked a previous checkbox
   } else {
       // clicked a next checkbox
   }
   // update the cindex;
   cindex = thisindex;
 });

Answer 3

您可以创建一个全局变量，用于存储上一个选中的按钮ID，并将其与当前变量进行比较。由于'a'，'b'，'c'是普通字符串，您可以使用默认的＆lt; 和＆gt; 运算符进行比较：

  var prevID = $('input[name=radio]:checked').attr('id');

  $("input[name='radio']").change(function()
  {
    var curID = $(this).attr('id');

    if (curID < prevID) {
        alert("Before");
    }

    else if (curID > prevID) {
        alert("After");
    }
    prevID = curID;

  });