我有一个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>
答案 0 :(得分:1)
由于this,您不能更改常量,因为它们是常量。
常量的值不能通过重新分配而更改,也不能重新声明。
const声明创建对值的只读引用。这并不意味着它拥有的值是不可变的,只是不能重新分配变量标识符。例如,在内容是对象的情况下,这意味着可以更改对象的内容(例如其属性)。
要能够更改数组中的任何条目,只需将其设为var或let变量即可。