我的indexOf()不起作用

时间:2017-03-24 03:54:12

标签: javascript arrays indexof

我项目的链接在这里: http://codepen.io/xruizify/pen/aJKpNJ

var reservedTimes = [];

$(function() {                       
   var idx = reservedTimes.indexOf(currentSelection);
   $("td").click(function() { 
      var selectedTime = $(this).parent().prop('className');
      var weekDay = $(this).prop('className').split(" ")[0];
      var currentSelection = weekDay + "and" + selectedTime;
      //var idx = reservedItems.indexOf(currentSelection); It didn't work here
      if ( $(this).is(".reserved") ) {  

      } else if($(this).is(".active")) {
        $(this).removeClass("active"); 
        //var idx = reservedItems.indexOf(currentSelection); I get 'undefined'
        document.getElementById("currentIDX").innerHTML = idx;   
        //The comment below is what I want to do in the future once idx works
        //reservedTimes.splice(idx,1);
        printTimes();      
      } else{
        $(this).addClass("active"); 
        document.getElementById("mainHeader").innerHTML = selectedTime;      
        document.getElementById("currentSelection").innerHTML = currentSelection; 
        document.getElementById("currentIDX").innerHTML = idx;
        document.getElementById("secondHeader").innerHTML = weekDay;
        reservedTimes.push(currentSelection);
        printTimes(); 
   } 
 });
});
function makeReservation() {
  $(".active").addClass("reserved");
  $(".active").removeClass("active");
  printTimes();
 }
 function printTimes() {
   document.getElementById("timeTitle").innerHTML = reservedTimes;
 }

基本上,您单击表格中的单元格,它会生成一个特殊的“代码”并将其添加到数组中。表中的每个单元格始终使用相同的唯一代码,并且不会更改。我希望能够获取它,在数组中获取它的indexOf()值,并在第二次单击它时将其删除。无论我在哪里声明idx变量,它都行不通,我无法想出这个。

1 个答案:

答案 0 :(得分:1)

它不起作用,因为您试图在indexOf上调用不存在的reservedItems;我认为你的意思是reservedTimes这是你要推送的阵列,然后你就可以按原样拨打splice

这适用于您的codepen(固定http://codepen.io/anon/pen/XMYpxa):

var reservedTimes = [];

$(function() {                          
  $("td").click(function() { 
    var selectedTime = $(this).parent().prop('className');
    var weekDay = $(this).prop('className').split(" ")[0];
    var currentSelection = weekDay + "and" + selectedTime;
    var idx = reservedTimes.indexOf(currentSelection); 
    if ( $(this).is(".reserved") ) {  

    } else if($(this).is(".active")) {
      $(this).removeClass("active"); 
      document.getElementById("currentIDX").innerHTML = idx;
      reservedTimes.splice(idx,1);
      printTimes();      
    } else{
      $(this).addClass("active"); 
      document.getElementById("mainHeader").innerHTML = selectedTime;      
      document.getElementById("currentSelection").innerHTML = currentSelection; 
      document.getElementById("currentIDX").innerHTML = idx;
      document.getElementById("secondHeader").innerHTML = weekDay;
      reservedTimes.push(currentSelection);
      printTimes(); 
    } 
  });

});
function makeReservation() {
    $(".active").addClass("reserved");
    $(".active").removeClass("active");
    printTimes();
}
function printTimes(){
  document.getElementById("timeTitle").innerHTML = reservedTimes;
}