Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 8 years ago.
Improve this question
My previous question was taken down as i was too vague so i have decided to throw it back out there in a better format.
So basically i have my javascript slider that works almost perfectly, i have decided to try to make it automatically scroll through images on the slider however, being me i've failed and broke it and now the images don't show at all. I have a jsfiddle of the code which i will link here: http://jsfiddle.net/wDmM7/
This is the javascript which i know is the Problem:
$(document).ready( function($)
{
timer = window.setInterval("autoSlide()", 1000);
function autoSlide()"next()".click(); }
var SliderWrapper = $('.SliderWrapper').find('ul');
$(SliderWrapper).find('li.active').show();
window.SliderWrapper =
{
previous: function()
{
var current = $( SliderWrapper ).find('li.active');
var prevElement = $( current ).prev('li');
if( prevElement.length != 0 )
{
$( current ).removeClass('active').fadeOut(2500);
$( prevElement ).addClass('active').fadeIn(2500);
}
},
next: function()
{
var current = $( SliderWrapper ).find('li.active');
var nextElement = $( current ).next('li');
if(nextElement.length != 0 )
{
$( current ).removeClass('active').fadeOut(2500);
$( nextElement ).addClass('active').fadeIn(2500);
}
}
}
});
Any Questions i will answer as soon as i can, i only that you be patient as i am a Junior Web Developer and am still learning.
I thank you all in advance.
Just call the SliderWrapper.next() function in the timer like this. You can comment out the autoSlide().
Code:
timer = window.setInterval("window.SliderWrapper.next()", 2000);
//function autoSlide(){"next()".click(); }
Line 5: function autoSlide()"next()".click(); }
Is not valid javascript.
Please correct your line 5 which is invalid javascript code:
function autoSlide()"next()".click(); }
With new code
function autoSlide().next().click();
Related
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 2 years ago.
Improve this question
I have a on click function which return 'x' and stores in div dynamically. After a page refresh, this dynamic div resets and the data is gone. But i want the data to stay. To do that i stored that in local storage and want to call later when page loads. I store it in local storage inside the function 'test'
and calling it in windows.onload which is returning null. I understand that i am unable to call the local storage inside the function. My question: Is there a way to call the local storage inside the function 'test'
function test(parameter1, parameter2) { // this is an onclick function
// some functionality
return x;
var test = x.innerHTML;
localStorage.setItem('somediv', test);
}
window.onload = function () {
var test2 = localStorage.getItem('somediv')
$('div.somediv').text(test2);
}
You are using localStorage fine.
The thing is, if you return x; in your text() function, the code below is never executed, so it never actually sets the localStorage variable.
That is why you get null when you are trying to access it.
Try this, you will get an idea.
Click me
<script>
function test(param) { // this is an onclick function
localStorage.setItem('somediv', param);
alert('ok');
}
window.onload = function () {
if(localStorage.getItem('somediv')==null){
return;
}
var test2 = localStorage.getItem('somediv')
//$('div.somediv').text(test2);
alert(test2);
}
</script>
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 3 years ago.
Improve this question
I have a few functions that are executed immediately
function calcTheSize() {
console.log("exec 1")
};
calcTheSize();
function setImages() {
console.log("exec 2")
};
setImages();
I also want them to run on a resize event like this
$window.resize(function() {
calcTheSize();
setImages();
});
The problem is I am getting
exec 1
exec 2
exec 1
exec 2
exec 1
exec 2
without any resizing
The window resize might be executed because you have your console open, scrolled, or an overflow (scrollbar) is added/removed. In any case, events like these should be registered when the DOM has finished loading.
$(document).ready(function (e) { // or use $(function() { ... }
$(window).on("resize", (e) {
calcTheSize();
setImages();
}
}
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 5 years ago.
Improve this question
i am not quite sure that Title related to my problem, so sorry.
I have asynchronous function that call callback function. So the main idea is I want to call function "dodo" each time after "asyncFunc" is done.
Are there some patterns for that? Are there issues releated to memory leak ?
var can = true;
function dodo() {
if(can)
{
can = false;
asyncFunc(function(data) {
doSmth();
can = true;
});
}
}
setInterval(dodo, 0);
The main idea is I want to call function "dodo" each time after "asyncFunc" is done.
So just call it there:
function dodoForever() {
asyncFunc(function(data) {
doSmth();
dodoForever(); // <==
});
}
dodoForever();
You don't need a global can state and setInterval.
You can just call it. Like so.
var can = true;
function dodo() {
if(can)
{
can = false;
asyncFunc(function(data) {
dodo(); // this will run `dodo` function again.
doSmth();
can = true;
});
}
}
setInterval(dodo, 0);
As the comments mention this will blow the stack up. You have dodo running every 0ms. This will basically call dodo a TON of times and that is basically all your program will be doing. I can't think of a use case where this would be necessary and it probably won't fair so well in terms of performance.
Really think about why you are trying to run it like that and what the end goal is.
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 6 years ago.
Improve this question
I am wondering how would I stop a setTimeout() that has already started? In my example below I have two buttons: .start and .cancel. Pressing .start would invoke the timer which will execute a console.log() after 2 seconds. I am trying to get the behavior where clicking .cancel would stop the timer from executing and to clear its queue. Is this possible?
The issue I am experiencing is that if I click on .start, and then immediately click on .cancel before the 2 second, I will still see btn clicked in the console. I do not want to see that console message.
var timer;
$('.start').on('mousedown', function() {
timer = setTimeout(function() {
console.log('btn clicked');
}, 2000);
});
$('.cancel').on('mousedown', function() {
clearTimeout(timer);
});
https://jsfiddle.net/xL8yquoL/
Your code cancels a single timer, but you could create several by clicking "start" many times.
If you need to cancel several timers you could keep an array of timer references.
In this example, each .cancel click clears the last timer created, because array.pop removes and returns the last item in array.
var timers = [];
$('.start').on('mousedown', function() {
timers.push(setTimeout(function() {
console.log('btn clicked');
}, 2000));
});
$('.cancel').on('mousedown', function() {
clearTimeout(timers.pop());
});
https://jsfiddle.net/xL8yquoL/1/
If you need to clear every timer with one click:
$('.cancel').on('mousedown', function() {
timers.forEach(clearTimeout)
timers = [];
});
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 7 years ago.
Improve this question
I'm using onclick for an element, but need to pass a callback to it like this:
function cb_func() {
alert("hello world!");
}
function foobar(i, cb) {
do something
if (cb != undefined)
cb();
}
onclick="javascript:foobar(1, cb_func)"
foobar gets called, but my cb_func isn't - in fact when I step in to cb() usinf Firebug, it shows me the HTML for the entire page.
Any ideas how I might achieve this?
Use event delegation:
$(document).on('click', '.dynamicGeneratedEl', function(event){
// do something
cb_func();
});
Where .dynamicGeneratedEl is a suitable selector for your case.
comment the line // do something
function cb_func() {
alert("hello world!");
}
function foobar(i, cb) {
// do something
if (cb != undefined)
cb();
}
Try this:
https://jsfiddle.net/h3ckcgvv/2/
var nextFunction = function() {
// some more stuff happens
}
var processClick = function() {
// some stuff happens
// condition
nextFunction();
}
$('.js-click-me').click(processClick);
The condition could be anything, based on page inspection, javascript variable state, data attributes on the clicked HTML element etc. Much more stable and maintainable than onclick attributes and hardcoding the callback into every call where it's needed.