使用JavaScript从常量数组​​中删除项目

时间:2018-09-21 06:22:56

标签: javascript html

我有一个div框002,将其拖放到名为 array2 的常量数组中具有随机选择的数字的三个类框中的任何一个时,该项目应从array2中删除。

为此,我创建了rvalue()函数的对象,并尝试删除 constfilteredItems 中的项目,但没有成功。

哪里出了错

如何实现?

var tempimages = [];


function rvalue() {
  var items = [  
      { label: '1:40', url: '1.png'  },
      { label: '2:20', url: '2.png'  },
      { label: '3:50', url: '3.png'  },
      { label: '4:45', url: '4.png'  },
      { label: '5:35', url: '5.png'  },
      { label: '6:10', url: '6.png'  },
      { label: '7:15', url: '7.png'  },
      { label: '8:10', url: '8.png'  },
      { label: '9:30', url: '9.png'  },
	    { label: '10:40', url:'10.png' },
      { label: '11:20', url:'11.png' },
      { label: '12:50', url:'12.png' },
      { label: '01:45', url:'13.png' },
      { label: '02:25', url:'14.png' },
      { label: '03:40', url:'15.png' },
      { label: '04:15', url:'16.png' },
      { label: '05:10', url:'17.png' },
      { label: '06:30', url:'18.png' },
      { label: '07:35', url:'20.png' }
	  ]
	  
ptags = document.querySelectorAll('[name="values"]');

const array2 = Object.assign([], items);

 


for (let index = 0; index < 3; index++) 
     {
      randomIndex = Math.floor(Math.random() * items.length),
      
      item = items[randomIndex];

      ptags[index].textContent = item.label;

      tempimages.push({data:item, index: randomIndex});
	  
	  ptags[index].dataset.itemIndex = randomIndex;
    }
	
  
}
	

function displayAllImages() {

  if (tempimages.length === 0) 
  {
    return;
  }
	item = tempimages.shift(),
  
    image = document.getElementById('slide');

    image.src = item.data.url;

    image.dataset.itemIndex = item.index;
    
};

$(function() {
  
  rvalue();
  displayAllImages(); 
});	

function allowDrop(ev) {
  ev.preventDefault();
}

function drag(ev) {
 
ev.dataTransfer.setData("Text", ev.target.id);
}

function drop(ev) {

ev.preventDefault();

console.log(ev.srcElement);

var data = ev.dataTransfer.getData("Text");

var el = document.getElementById(data);

alert(data);

alert(el);

var x=document.getElementById("slide").dataset.itemIndex;

var y = ev.target.dataset.itemIndex;

alert("x=>" + x + " y=>" + y);
  
 if(x==y)
  {
	//alert("go");
  el.parentNode.removeChild; 

  
  ev.currentTarget.style.backgroundColor = 'initial'; 

  var pParagraph = ev.currentTarget.firstElementChild;
  ev.currentTarget.removeChild(pParagraph);
  
   var ob1=new rvalue();
   var delitem=ob1.item;
   var filteredItems = array2.filter(item => item!== valueToRemove)
  
  
   console.log(filteredItems);
   console.log(delitem);
  
  
  
  displayAllImages();
  }
  else{
  alert("WRONG PLACE");
  }
}
.box002 {
            width: 30px;
            height: 30px;
            float: left;
			      border:2px solid #333;
        }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="container">
            
                <div class="box"  ondrop="drop(event)" ondragover="allowDrop(event)" id="10"><p name="values"></p></div>
                <div class="box"  ondrop="drop(event)" ondragover="allowDrop(event)" id="11"><p name="values"></p></div>
                <div class="box"  ondrop="drop(event)" ondragover="allowDrop(event)" id="12"><p name="values"></p></div>
            </div>
            
    
<div class="box002" draggable="true" ondragstart="drag(event)" id="2">
	<img src=""  draggable="true" id="slide" style="width:120px; height:120px; border-radius: 50%;" border="rounded"/>
</div>

1 个答案:

答案 0 :(得分:1)

由于this,您不能更改常量,因为它们是常量。

  

常量的值不能通过重新分配而更改,也不能重新声明。

     

const声明创建对值的只读引用。这并不意味着它拥有的值是不可变的,只是不能重新分配变量标识符。例如,在内容是对象的情况下,这意味着可以更改对象的内容(例如其属性)。

要能够更改数组中的任何条目,只需将其设为var或let变量即可。