Javascript jQuery函数，用于检查是否存在多个div'；s的数据索引是有序的

我随机输出div的顺序，每个div都有一个数据索引。我使用jQueryUI实现其可排序方法，这样用户就可以重新排列div的顺序。我如何使其在按下submit按钮时调用一个函数来检查每个元素的数据索引是否有序

DOM结构如下所示：

<div class="sequence_boxes sortable sortable_area ui-sortable">
  <div class="box" data-index="0">..</div>
  <div class="box" data-index="1">..</div>
  <div class="box" data-index="2">..</div>
  <div class="box" data-index="3">..</div>
</div>

..
..
..
..

我的jQuery：

$('.sequencing').append('<div class="sequence_boxes sortable sortable_area"></div>');

$('.sequence_option').each(function (i) {
    $('<div class="box"></div>').appendTo($('.sequence_boxes')).append(this);
    $(this).attr("data-index", i);
    $(this).parent().attr('data-index', i);

});

$('.sequence_boxes').each(function () {

    // get current div
    var $div_parent = $(this);

    // get array of childs in parent div
    var $divsArr = $div_parent.children('.box');

    // sort array of childs in parent div (#sponsors) randomly
    $divsArr.sort(function (a, b) {

        // Get a random number between 0 and 10
        var temp = parseInt(Math.random() * 10);

        // Get 1 or 0, whether temp is odd or even
        var isOddOrEven = temp % 2;

        // Get +1 or -1, whether temp greater or smaller than 5
        var isPosOrNeg = temp > 5 ? 1 : -1;

        // Return -1, 0, or +1
        return (isOddOrEven * isPosOrNeg);
    })

    // append child items to parent
    .appendTo($div_parent);
});



$('.sortable_area').sortable({
    dropOnEmpty: true,
    forcePlaceholderSize: true,
    forceHelperSize: false,
    connectWith: ".sequence_boxes",
    scrollSensitivity: 200,
    scrollSpeed: 40,
    placeholder: "ui-sortable-placeholder",
    cursor: "move",
    distance: 0.5,
    delay: 100,
    opacity: 0.6,
    tolerance: "pointer",


}).disableSelection();

$（'.sequencing'）。追加（''）；
$（'.sequence_option'）。每个（函数（i）{
$（''）.appendTo（$（'.sequence_-box'））.append（this）；
$（此）.attr（“数据索引”，i）；
$（this.parent（）.attr（'data-index'，i）；
});
$（'.sequence_Box'）。每个（函数（）{
//获取当前div
var$div_parent=$（此项）；
//获取父div中的child数组
var$divsArr=$div_parent.children（'.box'）；
//随机排序父div（#赞助商）中的child数组
$divsArr.sort（函数（a，b）{
//获取一个介于0和10之间的随机数
var temp=parseInt（Math.random（）*10）；
//获取1或0，无论温度是奇数还是偶数
var isOddOrEven=temp%2；
//获取+1或-1，无论温度大于或小于5
变量IsPosoreng=温度>5？1:-1；
//返回-1、0或+1
返回（isOddOrEven*isposoreng）；
})
//将子项附加到父项
.appendTo（$div_parent）；
});
$（'.sortable_area'）。可排序({
真的，
大小：true，
forceHelperSize:false，
连接到：“.sequence_Box”，
敏感度：200，
滚动速度：40，
占位符：“ui可排序占位符”，
光标：“移动”，
距离：0.5，
延误：100，
不透明度：0.6，
公差：“指针”，
}).disableSelection（）；

解决方案很简单：

更新： 是一种更加一致的实现：

你的情况：

$('.sequence_boxes .box').isOrdered('asc', 'index');

用法： }))

• 订单：“asc”或“desc”（订购人）
• 数据：“索引”。。。数据（您的数据类型）
• fail[可选]：当节点出现故障时要执行的回调函数（fail节点是第一个参数）
• success[可选]：在一切正常的情况下执行的回调函数

资料来源：

jQuery.fn.extend({
  isOrdered: function(orderBy, data, succ, fail){
    var correct_index = 0, o = 1, f = false, t = this;
    if(orderBy == 'desc') {
      correct_index = this.length - 1;
      o = -1;        
    }
    this.each(function(){
      var current_index = $(this).data('index');
      if(current_index != correct_index) {
        if(fail) fail.call(t, this);
        f = true;
        return false;
      } 
    correct_index += o;
    }); 
    if(!f && succ) succ.call(this, this);
    return this;
  }
});

---

您想知道如何将JS绑定到按钮，还是如何编写JS来执行您所询问的检查？@TylerH我知道如何设置onclick。我需要函数来实际检查它是否按顺序放置在onclick块中你抓到我了菲利克斯。。。做了一个巨大的更新来涵盖这一点！

$(selector).isOrdered(order, data, [fail], [success]);

jQuery.fn.extend({
  isOrdered: function(orderBy, data, succ, fail){
    var correct_index = 0, o = 1, f = false, t = this;
    if(orderBy == 'desc') {
      correct_index = this.length - 1;
      o = -1;        
    }
    this.each(function(){
      var current_index = $(this).data('index');
      if(current_index != correct_index) {
        if(fail) fail.call(t, this);
        f = true;
        return false;
      } 
    correct_index += o;
    }); 
    if(!f && succ) succ.call(this, this);
    return this;
  }
});