javascript - 根据定位运行不同的功能

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，如果小于则触发前函数，否则触发后函数。然后将当前索引重置为现在的索引。

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;
});

<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>