Trigger click after time delay with jQuery - javascript

I would need to trigger a pop by replicating a click event after 10 sec using the following HTML with jQuery only once for the user. Any click trigger snippet that might do? and if possible to set cookie in the code so not to show the pop again for the same user? thanks.
Note: I can not using the class as that will trigger the link not the pop. It needs to be done using the data-target and I don't seem able to make it work.
Also please I can not use another pop, it needs to be the one above! This to avoid suggestions of using third party pops etc..
If someone can help with jQuery snippet for this would be great, thank.

Never mind I solved it very simply and actually the selector method works!
Anyone interested here is the code
setTimeout(function() {
$('.register').trigger('click');
}, 60000);

Related

Using element.click() to simulate a Button Click in Javascript

I'm trying to write an extension for Opera that automatically sends specific chat messages. (Commands, to be exact.) For that, I want to enter the message into the textarea, simulate a button click to send the message and read the reply I get.
I've been trying to use the Element.click() function of JavaScript to simulate the click, but it doesn't work.
My code goes something like this:
document.getElementsByClassName("text-area")[0].value = "test";
document.getElementsByClassName("send-chat-button")[0].click();
The textarea gets filled in with the value I want, but it doesn't click the button.
I am also not getting any output on the console. I'd be glad about any help I can get.
Regards, Kileraptor1
UPDATE: You were right, the button does not have an OnClick event like I thought it had. I'm honestly not sure how it submits a message. Since I am writing a plugin for a website I do not own, I can not edit the source or anything.
The easiest way would be with the trigger() function in jQuery:
$(".send-chat-button:first").click(function()
{
// Whatever actions you want to perform on click
});
$(".send-chat-button:first").trigger("click"); // Executes the click event handler
trigger(event) will execute whatever specified events that are attached to an element at any point in the code.
If you want to use pure JavaScript, there's already a good answer here. As I said though, jQuery makes this extremely simple.

Having an issue with jquery functions not working properly

I've been trying to get this little project I'm doing finished, but for some reason it is not properly working.
The issue is when I first visit the page and click the first link that appears in the main section it displays the popup box as wanted. Now when I click another day, for instance sunday and try to click the first link it doesn't do anything. And if I click back to Saturday the first link also doesn't do anything anymore.
It seems something is not properly activating or maybe a command is overwriting and not allowing it to work like it does when you first hit the landing page. I'm sorry if this is confusing but any help would be much appreciated.
The website is pouronline.com
that's where i do all my testing.
Thank you
You need to use the .live function.
So in your popup.js replace
$('a.poplight[href^=#]').click(function() {
with
$('a.poplight[href^=#]').live('click',function() {
Swap this:
$('a.poplight[href^=#]').click(function()
with this:
$('a.poplight[href^=#]').live('click',function()
You need to use a future-proof event observer because once you reload those anchors by changing the day in this case, the initial binding is lost. live() means to apply the binding to currently existing nodes as well as nodes that are added to the DOM at a later time.

strange behavior on display|display:none elements

I have a custom modal dialogue that consists of a simple div and some css. There are 2 buttons (OK, CANCEL) buttons. The CANCEL button is always the same; it hides the modal dialogue via onclick="$('#div').css('display','none')" (NB: this is also how the modal is shown; ('display','')). I assign different actions to the OK button depending on the need. This is done via $('#okBTN').attr('onclick','my_function()').
It works, but only the first time ©
The first time I open the modal and walk through the steps, everything works as expected. If I close the modal, however, then re-open it, the OK button has no action on it. I mean, the onclick is assigned (correctly); it's in the source code, and it will alert correctly via .attr('onclick'), but clicking the button does nothing. I have it set that when the modal pops up, the onclick is assigned each time; but it's almost as if there is a shadow copy or something stuck in memory or the DOM. Although, I don't see anything strange in Firebug....
I've tried cloning the button, reassigning it, then replaceWith'ing. I've also tried remove'ing it and re-adding it...
Any clues?
Hate to say it my friend but you're not leveraging the benefits of jQuery.
Why set display via CSS? Just use .hide() .show() or .toggle().
Why are you setting on onclick attribute via javascript? This doesn't make much sense at all. Use $(elem).click(my_function);
The second bullet will likely fix your problem, but I'd do some serious re-evaluation.
Good luck!
Use bind or event-name binders:
$('#okBTN').click(my_function)
I'd try using .css('display','block') instead of .css('display',''), as assigning a blank display value doesn't seem like a good idea (it might work, but just to be safe).
Have you tried setting the .bind() function of the element?
$('#okBTN').bind('click', my_function);

jQuery: hover menu - code cleanup - keep menu open

I've searched SO and this question seems to have been asked multiple times, but I can't seem to get it to work in my example.
Here's some code to play with:
http://jsfiddle.net/vol7ron/w8QsZ/2/
What I'm looking for is something similar to the to the flowplayer tooltip, where:
there's a trigger that causes the menu to appear when hovered
the menu disappears on leaving the trigger
if the user hovers over the menu (or tooltip), then the popup should stay open
My guess is that the trigger's hoverOut should call the disappear using setTimeout() with some delay, but on the menu's mouseenter(), the timeout should be cleared.
I'm still new to jQuery and am unsure where to store the generated timeoutID and where to call it.
Note: the same menu will be used for multiple triggers.
Update: Okay, I have something working: here
Could someone please help me clean it up and make it more efficient. More importantly, I would like not to use globals for the timeoutID. Perhaps there's a better way to store it in the object?
I just did something like this recently. What I would do is
var timer = setTimeout(/*blah*/);
$('#my_selector').data('timer') = timer;
I throw the timeoutID in the data for that element and then whenever I need to do something with it later (clearTimeout) I can just grab it from there.
note I used this method and it worked for a dynamic amount of elements, which is what I think you want. Just let me know if you need more of an explanation!

Strange JavaScript issue with timeout

I see a developer using this in my site:
window.setTimeout("pg.init()", 10);
The problem is that when I click once on the record set it works fine. However when I click on the record right away all I get is the hour glass. However if I wait and then click, it works again. What could be wrong? Any suggestions?
What happens if you invoke pg.init() without the timeout?
pg.init();
Alternatively, you could try a lower timeout, but that probably won't make any difference as it's already low:
window.setTimeout("pg.init()", 1);
Your question hardly makes any sense, but if I were to chance a guess, I would say disable the clickable element(s) (or removed the onclick handlers) within the record set once clicked, and add functionality to pg.init() which reactivates it/them.

Categories

Resources