I have the following bit of code, simply:
$(function() {
$('a.add-photos-link').live('click', function(e) {
$(this).colorbox({
overlayClose: false,
onComplete: function() {
$('#add_photos').submit(function(e) {
// more stuff to do
e.preventDefault();
});
}
});
e.preventDefault();
});
});
However, this only seems to work after single-clicking on the link TWICE. These links are dynamically added to the page (a.add-photos-link
).
Why is this happening and what can I do to fix it so it fires after the first single-click?
That's because you're registering an event listener on every click! So your listener executes once more every time you click.
The dblclick() is an inbuilt method in jQuery which is used to trigger the double-click event to occur. This method occurs when the selected element will be double clicked. Syntax: $(selector).
$("a. button"). one("click", function() { $(this). click(function () { return false; }); });
jQuery dblclick() Event The dblclick event occurs when an element is double-clicked. The dblclick() method triggers the dblclick event, or attaches a function to run when a dblclick event occurs.
Your current code only creates a colorbox for the link. It does not open the colorbox, which is why you need to click the link twice: once to create it and again to open it.
You can use the open
option (as documented) when creating the colorbox to open it immediately, like so:
$(this).colorbox({
open: true,
overlayClose: false,
onComplete: function() {
// ...
}
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With