Javascript 使用$（this）和干方法jquery将值推送到数组中

我在寻找基于div的数组时遇到了一些困难

我的目标是把我在每个元素上停留的时间加起来。相反，我不是为每个div创建相同的函数，而是想尝试一种枯燥的方法。这很难想象

我想在更改div时更改我正在推入的数组。我找到了一种将所有时间添加到一个数组中的方法。然而，这不是我的目标

这是我的代码的一个非常简短的版本，我附加了一个plunker来展示它是如何工作的。在控制台中，您可以看到时间的变化

我正在进入时间数组。理想情况下，我可以插入panelHeading数组或panelHeadingArray

这是我的iffe被用于干燥的方法

var timeMonitering = (function() {
    var mouseenterTime = 0;
    var timeArray = [];
    var navArray = [];
    var panelHeadingArray = [];

    return {
        inAndOut: inAndOut
    }

    function inAndOut(evt) {
        var currentTime = new Date();
        var mouseoverTime;
        if(evt.type === 'mouseenter') {
            mouseenterTime = currentTime.getTime();
        }
        else if (evt.type === 'mouseleave') {
            mouseoverTime =currentTime.getTime(); 

        }

        var time =mouseoverTime - mouseenterTime;
        if(time >0) {
            timeArray.push(time/1000);
        }
        console.log('time array added',Math.round(timeArray.reduce(add,0) ));
        return time/1000;
    }

    function add(a,b) {
        return a +b;
    }

})();




 $(document).on('ready', function() {
    $('.navbar').bind('mouseenter mouseleave', timeMonitering.inAndOut);

   $('.panel-heading').bind('mouseenter mouseleave', timeMonitering.inAndOut);
});

需要弄清楚如何推进navArray或PanelHeadinArray 取决于我鼠标移动的位置

任何帮助都将不胜感激

*******更新************************

下面是我基本上能够添加每个阵列的时间的方法。
当我将鼠标悬停在元素上时，巨型数组将秒数相加。但是，我想重用这个函数，或者像上面显示的那样

var enteredTime = 0;
var jumbotronArray = [];
var listGroupArray = [];


$('.jumbotron').hover(function(evt) {
  enteredTime = new Date();
  console.log('e',enteredTime)
}, function() {
  var ctime = new Date();
  var time = (ctime.getTime() - enteredTime.getTime())/1000;

  jumbotronArray.push(time);
  console.log('time spend ' + time/1000 + 'sec');
  console.log('jumbotronArray',jumbotronArray)
  console.log('added',Math.round(jumbotronArray.reduce(add,0) ));
})


$('.list-group').hover(function(evt) {
  enteredTime = new Date();
}, function() {
  var ctime = new Date();
  var time = (ctime.getTime() - enteredTime.getTime())/1000;

  listGroupArray.push(time);
  console.log('listGroupArray',listGroupArray)
  console.log('listGroupArray added',Math.round(listGroupArray.reduce(add,0) ));
})


function add(a,b) {
        return a +b;
    }

---

您可以使用条件选择哪个数组，然后对其调用push

var array;
if (condition) {
  array = navArray;
} else {
  array = panelHeadingArray;
}
array.push(...);

或者更简洁地使用三元运算符

(condition ? navArray : panelHeadingArray).push(...)

编辑：

---

根据div id更新计数创建一个带有密钥的映射，但不确定是否遵循您的逻辑。你能举个例子吗？@arcyqwerty提供了一个可靠的答案，减少了代码。我认为这不应该被否决。我的挑战是，这将是大约20个div。为了便于阅读，我缩短了这段代码。我不确定您在代码中的什么地方尝试这样做，也不确定您选择阵列的条件是什么。如果是有条件的，可以使用If/else或switch。如果它是基于索引或字符串的，您可以使用数组/对象来维护对数组的引用。我正在更新我的问题，以表明我可以用每个元素完成这项工作。我的目标是获得更好的干燥感。仍然不太确定要将值放入哪些数组，以及基于哪些条件。您能否提供一个示例，包括

array1=[]；阵列2=[]，阵列3=[]。。。如果（某物）排列1.推动（…）；如果（别的东西）排列2.按（…）？我在底部的更新中添加了两个函数。它们都是一样的。理想情况下，我可以使这些可重复使用。
var enteredTime = 0;
var jumbotronArray = [];
var listGroupArray = [];

var mapping = {
  ".jumbotron": jumbotronArray,
  ".list-group": listGroupArray
};

Object.keys(mapping).forEach(function(selector) {
  $(selector).hover(function(evt) {
    enteredTime = new Date();
  }, function() {
    var ctime = new Date();
    var time = (ctime.getTime() - enteredTime.getTime())/1000;
    mapping[selector].push(time);
  });
}