Javascript array splice doesn't work with JQuery click event [duplicate] - javascript

This question already has answers here:
Javascript infamous Loop issue? [duplicate]
(5 answers)
Closed 3 years ago.
in for loops, array.splice doesn't work
the array doesn't change
I changed some position, confirm it doesn't work in chrome.
var menu =['#men','#wmen','#ftwear','#accsries','#chldren','#dscver']
for( var i = 0; i < menu.length; i++){
$(menu[i]).click(function(){
menu.splice(i, 1);
console.log(menu)
menu.forEach(function(list){
$(list+' ul').slideUp(300)
$(list).removeClass('bold')
})
menu.splice(i, 0, menu[i]);
console.log(menu)
})
}
I hope the for Loops work with array.splice

You need to bind the value of i to the function inside the click - since it is called asynchronously. Try using let instead of var inside the for statement:
var menu =['#men','#wmen','#ftwear','#accsries','#chldren','#dscver']
for( let i = 0; i < menu.length; i++){
$(menu[i]).click(function(){
menu.splice(i, 1);
console.log(menu)
menu.forEach(function(list){
$(list+' ul').slideUp(300)
$(list).removeClass('bold')
})
menu.splice(i, 0, menu[i]);
console.log(menu)
})
}

Related

How do I capitalize all text in a document using the DOM and the toUpperCase function? [duplicate]

This question already has answers here:
textContent and innerHTML not changing the DOM
(3 answers)
Closed 1 year ago.
I want to capitalize every single paragraph in a website using the document.querySelectorAll() function.
I don't know what parameter to choose so I can get an array of all the texts.
Here is my Code:
var txtArr = document.querySelectorAll("p");
function capitalize(txtArr){
for (var i = 0; i < txtArr.length; i++){
txtArr[i].textContent.toUpperCase();
}
}
capitalize(txtArr);
Maybe try
var txtArr = Array.from(document.querySelectorAll("p"));
function capitalize(txtArr) {
for (var i = 0; i < txtArr.length; i++){
txtArr[i].textContent = txtArr[i].textContent.toUpperCase();
}
}
capitalize(txtArr);

I'm trying to get this simple vanilla JS work in IE11/10 [duplicate]

This question already has answers here:
JS ForEach Loops in IE11
(4 answers)
Closed 3 years ago.
The script works everywhere but IE, I tried to google about it but all I could find is that forEach is not supported by IE, but I am not sure what loop to use to repalce this. Can someone help with this? Here is the code:
const liwraps = document.querySelectorAll('.subpage-menu-li.submenu_has_children');
liwraps.forEach(function(liwrap){
const arwdrp = liwrap.querySelector('.arrow-drop'),
ulsub = liwrap.querySelector('.subpage-submenu-ul'),
ulsubp = ulsub.parentElement
if(ulsubp.classList.contains('current_page_item', 'current_page_parent') || ulsubp.classList.contains('current_page_parent')){
ulsub.classList.add('active-subpage-submenu');
arwdrp.classList.add('rotaten');
}
if(arwdrp){
arwdrp.addEventListener("click", function(){
ulsub.classList.toggle('active-subpage-submenu');
arwdrp.classList.toggle('rotaten');
});
};
});
You can use normal for loop.
for (var i = 0, n = liwraps.length; i < n; ++i) {
var liwrap = liwraps[i];
// your function code goes here
}

Why it says push is not a function when called? [duplicate]

This question already has an answer here:
Why does [].push([]) return 1? [duplicate]
(1 answer)
Closed 3 years ago.
function rotLeft(a, d) {
var temp=[];
temp=a.splice(0);
for(let i=0; i<d-1; i++)
{
var first=temp.shift();
temp=temp.push(first);
}
var result=temp;
return temp;
}
if you know the rotate left problem in hackerrank, why woudnt this code work. The console says push is not a function. whats wrong in this code. Also please explain arr.shift(arr.push(arr[0])); this line. The first element is pushed to the last element and the first element is removed?
It should be temp.push(first); not temp=temp.push(first);
function rotLeft(a, d) {
var temp=[];
temp=a.splice(0);
for(let i=0; i<d-1; i++)
{
var first=temp.shift();
temp.push(first);
}
var result=temp;
return temp;
}
console.log(rotLeft([1,2,3,4,5,6],8))

document.getElementById(array[x]) returning null [duplicate]

This question already has answers here:
Why does jQuery or a DOM method such as getElementById not find the element?
(6 answers)
Closed 7 years ago.
I am trying to call an element using an array index value but I keep getting a null message.
JS:
function img_disp() {
var num = 0;
var images_array = ["person_1","person_2","person_3","person_4","person_5","person_6","person_7","person_8","person_9","person_10","person_11","person_12"];
document.getElementById(images_array[num]).style.visibility = "visible";
}
What can I do to make this work? I want to be able to call different ids using 1 function.
Thanks
You're not incrementing the variable num, You can use loops to do it, eg:
function img_disp() {
var images_array = ["person_1","person_2","person_3","person_4","person_5","person_6","person_7","person_8","person_9","person_10","person_11","person_12"];
for(var num = 0; num < images_array.length; num++){
document.getElementById(images_array[num]).style.visibility = "visible";
}
}
img_disp() It should be called when the DOM is loaded. Check this question, for know more about it.

tried to change the inner element of dynamic div through class name but its not working [duplicate]

This question already has answers here:
How to use getElementsByClassName in javascript-function? [duplicate]
(3 answers)
Closed 8 years ago.
I have create the dynamic div and now trying to change the inner html of it but its not working please help me here is the code
function like(id)
{
var orgnldiv=document.getElementById(id);
var ndiv=document.createElement('DIV');
ndiv.id = 'like';
ndiv.className="likeclass";
var classname = document.getElementsByClassName("likeclass");
orgnldiv.appendChild(ndiv);
classname.innerHTML="example";
//alert(id);
}
Beware of the s in Elements. That means that you are getting a list rather than a single control.
Check How to use getElementsByClassName in javascript-function?
Use this:
function like(id)
{
var orgnldiv=document.getElementById(id);
var ndiv=document.createElement('DIV');
ndiv.id = 'like';
ndiv.className="likeclass";
orgnldiv.appendChild(ndiv);
var elements = document.getElementsByClassName("likeclass");
for(var i = 0; i < elements.length; i++) {
elements[i].innerHTML="example";
}
}
You get error because getElementsByClassName returns array of elements, not one elements. So you have to work with result like with array. If 1 element return loop will fire only 1 time. If 0 elements it wouldn't fire.
Hope this will help.

Categories

Resources