I have a search field and in that field I can search an item. Then I have to remove it, but unfortunately I don t know how I can remove that item. Please, could you help me with that. I tried the following: If
t know how I can remove that item. Please, could you help me with that. I tried the following: If
t know how I can remove that item. Please, could you help me with that. I tried the following: If
id of
currentRobot is equal to
current id` then delete that item, but I guess it is not quite right, cause it is not working My code
$(document).ready(function(){
var currentRobot=null;
for( var i=0; i<robots.length; i++){
var robot = document.createElement('div');
robotsContainer.appendChild(robot);
robot.className='whole-block';
robot.setAttribute('id', robots[i].id);
robot.innerHTML += "<img src='" + robots[i].avatar + "'>";
robot.innerHTML += "<h3>" +robots[i].first_name + "</h3>";
robot.innerHTML += "<h3>" +robots[i].last_name + "</h3>";
robot.innerHTML += "<p>" +robots[i].email + "</p>";
robot.innerHTML += "<p>" +robots[i].gender + "</p>";
robot.innerHTML += "<p>" +robots[i].friends + "</p>";
}
console.log(value)
value.onkeyup = function(e){
currentRobot=e.target.value;
var robots = document.querySelectorAll("div[id]:not([id='"+ this.value +"']):not([id='robotsContainer'])");
for(var i = 0; i < robots.length; i++ ){
if(this.value==""){
robots[i].style.display="block";
} else {
robots[i].style.display="none";
}
};
};
var button= document.getElementById('button');
button.addEventListener('click', function(e){
e.preventDefault();
for(var i = 0; i < robots.length; i++){
if (robots[i].id === currentRobot) robots.splice(i, 1);
}
}, false);
});
You are assiging currentRobot
currentRobot=e.target.value;
and then you are comparing its value
if (robots[i].id === currentRobot) robots.splice(i, 1);
My hunch is that currentRobot
and robots[i.id
is not of the same type. Before the comparison try adding
console.log( currentRobot, robots[i].id);
They need to be of the same data type for this comparison to work.
Also, please keep in mind that the first index of an array is 0
not 1
.
Without knowing what the global robots
is, we must guess.
robots
is a true array If robots
is a true JavaScript array, then the removal from the array should work with splice
, but:
So, your code could deal with that as follows:
So replace this:
if (robots[i].id === currentRobot) robots.splice(i, 1);
..with:
if (robots[i].id === currentRobot) {
var node = document.getElementById(currentRobot);
node.parentNode.removeChild(node);
robots.splice(i, 1);
break; // and exit loop!
}
robots
is an HTML Collection If your global variable robots
is an HTML collection, then it is array-like, but not a true array, so you cannot apply splice
on them. Instead you must use DOM methods.
So then replace this:
if (robots[i].id === currentRobot) robots.splice(i, 1);
..with:
if (robots[i].id === currentRobot) {
robots[i].parentNode.removeChild(roots[i]);
break; // and exit loop!
}
You need to exit the loop, as it will be awkward to continue the loop on a mutating HTML Collection, and it also is not necessary, since you expect only one match any way.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.