This question already has answers here:
Is there a [universal] way to invoke a default action after calling event.preventDefault()?
(5 answers)
Closed 8 years ago.
Once preventDefault(); is called, how can I invoke that event that was just prevented?
For example:
$("a").click(function(e){
setTimeout(function(){
e.huh? // run original function
},5e3);
});
This will work
$("a").one("click", function (e) {
e.preventDefault();
var elem = this;
setTimeout(function () {
elem.click();
}, 2000);
});
http://jsfiddle.net/XyETg/3/
Related
This question already has answers here:
onclick function runs automatically
(4 answers)
Closed 1 year ago.
I am wondering why doStuff() is called without clicking.
function pageReady() {
var buttonBox = document.getElementById("buttonBox");
buttonBox.onclick = doStuff();
function doStuff() {
buttonBox.style.background = "orange";
buttonBox.style.width = "600px";
buttonBox.innerHTML = "<h2>SURPRISE!!</h2>";
}
}
You're invoking the function, you should change
buttonBox.onclick = doStuff()
to
buttonBox.onclick = doStuff;
Now you're passing the function to the handler without invoking it.
This question already has answers here:
How to access the correct `this` inside a callback
(13 answers)
Closed 4 years ago.
hi I want to use 'this' variable in setInterval in a jquery function
I write '// this code don't work' after don't worked line
(function($)
{
$.fn.rotate=function () {
var counter=0;
var timer=setInterval(function () {
counter++;
var transform='rotate('+counter+'deg)';
$(this).css('transform',transform); // this code dont work
if(counter>=300)
clearInterval(timer);
},1);
return this;
};
$('#socialNetworks i').rotate();
}(jQuery))
thanks Alot
Using the arrow function when defining the function maintains the this context in which the function has been called. Thus you would be able to access this inside the function correctly.
( $ => {
$.fn.rotate=function () {
var counter=0;
var timer=setInterval(function () {
counter++;
var transform='rotate('+counter+'deg)';
$(this).css('transform',transform); // this code dont work
if(counter>=300)
clearInterval(timer);
},1);
return this;
};
$('#socialNetworks i').rotate();
})(jQuery)
This question already has answers here:
Pass correct "this" context to setTimeout callback?
(6 answers)
Closed 5 years ago.
Here is my code.
document.getElementById("t-option").addEventListener("click", function () {
setTimeout(function () {
myFunction(this);
}, 1500)
});
I want "this" to return the "t-option". It is a radio button and I want to know each time which one has been called.
Maybe there is a complete alternative way to do this, I don't know.
This might help you.
function myFunction(self)
{
console.log(self);
}
var option = document.getElementById("t-option");
option.addEventListener("click", function(){
var self = this;
setTimeout(function() { myFunction(self);}, 1500);
});
<input type="checkbox" id="t-option">
This question already has answers here:
Pass correct "this" context to setTimeout callback?
(6 answers)
Closed 6 years ago.
I have an event for click-and-hold on a dynamic element
var timeoutId = 0;
$(document).on('mousedown', '.createbtn', function(){
timeoutId = setTimeout(showNewInfoCreateDlg, 1000);
}).on('mouseup mouseleave', '.createbtn', function() {
clearTimeout(timeoutId);
});
and the function is "showNewInfoCreateDlg"
I need to know what is the id of the element that was clicked-and-held
function showNewInfoCreateDlg(){
alert($(this).attr('id'));
}
The function alerts "undefined"
Here is the jsfiddle for my problem:
JsFiddle
Explicitly bind it to the function:
var timeoutId = 0;
$(document).on('mousedown', '.createbtn', function(){
timeoutId = setTimeout(showNewInfoCreateDlg.bind(this), 1000);
}).on('mouseup mouseleave', '.createbtn', function() {
clearTimeout(timeoutId);
});
To clarify: The bind() function will, well, bind the value of its first argument to the this variable inside showNewInfoCreateDlg. This is called explicit binding.
This question already has answers here:
Pass correct "this" context to setTimeout callback?
(6 answers)
Closed 9 years ago.
I have a piece of javascript code:
var intervalId;
intervalId = setInterval(fetchData, 2000);
$('.campaign-select li').on("click", "a", function(event)
{
window.clearInterval(intervalId);
intervalId = setInterval(fetchData_id($(this).data('campaign-id')), 2000);
});
The first setInterval was correct, the function fetchData is correctly loaded each 2 seconds.
But when I click the .campaign-select li a element, the fetchData_id is executed but only once, not repeated as expected with setInterval.
Any help?
Thanks.
You can't pass parameter in the setInterval function.
That being said, you should try this :
$('.campaign-select li').on("click", "a", function(event){
window.clearInterval(intervalId);
var $this = $(this)
intervalId = setInterval(function(){
fetchData_id($this.data('campaign-id'))
}), 2000);
});