SOURCE

var submit = $('#submit');
var originalArray = [];
insertVal(originalArray, false);

var addValArray = [];
var delValArray = [];
var defValArray = [];
submit.on('click', function(event) {
  event.preventDefault();
  var selectInputIdArray = [];
  insertVal(selectInputIdArray, true);
  alert('新增选择值为：' + addValArray + '``````' + '删除选择值为：' + originalArray + '```````' + '原有选择值为：' + defValArray);
  window.location.reload();
});
function insertVal(box, flag) {
  var input = $('input:checkbox:checked');
  $.each(input, function() {
    var idVal = $(this).attr('data-id');
    box.push(idVal);
    if (flag) {
      var isExist = $.inArray(idVal, originalArray); //遍历是否在原数组中 如存在返回当前索引值
      if (isExist !== -1) { //在元素组中
        originalArray.splice($.inArray(idVal, originalArray), 1);
        defValArray.push(idVal);
      } else {
        addValArray.push(idVal);
      }
    }
  });
}

<script type="text/javascript" src="http://n.sinaimg.cn/sifa/video/js/jquery-1.11.0.min.js">
</script>
<link href="http://n1.sinaimg.cn/news/zxfy/css/head_foot.css" rel="stylesheet"
type="text/css" />
<div class="container">
  <div class="item">
    <input type="checkbox" checked data-id="11">
    11
    <br>
    <input type="checkbox" checked data-id="12">
    12
    <br>
    <input type="checkbox" data-id="13">
    13
    <br>
    <input type="checkbox" data-id="14">
    14
    <br>
    <input type="checkbox" data-id="15">
    15
    <br>
    <input type="checkbox" data-id="16">
    16
    <br>
    <input type="checkbox" data-id="17">
    17
    <br>
    <input type="checkbox" data-id="18">
    18
    <br>
    <input type="checkbox" data-id="19">
    19
    <br>
    <input type="checkbox" data-id="20">
    20
    <br>
  </div>
  <button id="submit">
    提交
  </button>
</div>