I have been dealing with an odd problem that .click()
events happen twice whenever placed in a jQuery Dialog.
My simple test case is below and a live example is here
<div id="popup" style="display: none">
<a href="javascript:void(0);" id="testlink">Test Link</a>
<script type="text/javascript">
$('#testlink').click(function(){
alert("Test Link clicked");
return 0;
});
</script>
</div>
<script type="text/javascript">
$(document).ready(function(){
$('#popup').css('display','block');
var h=($(window).height()+0.0)*0.9;
var w=($(window).width()+0.0)*0.9;
if(w >= 800){
w = 800;
}
$('#popup').dialog({
autoOpen: true,
width: w,
height: h,
modal: true,
open: function(event,ui){
$('body').css('overflow', 'hidden');
},
close: function(event,ui){
$('body').css('overflow', 'scroll');
}
});
});
</script>
To run the code on double clicked we use dblclick () method. This method is used to trigger the double-click event to occur. This method occurs when the selected element will be double clicked. Parameter: It accepts an optional parameter “args” which specifies a function that do a specific task after double clicking.
The click event occurs when an element is clicked. The click () method triggers the click event, or attaches a function to run when a click event occurs. Optional.
Commonly Used jQuery Event Methods $(document).ready() The $(document).ready() method allows us to execute a function when the document is fully loaded. This event is already explained in the jQuery Syntax chapter. click() The click() method attaches an event handler function to an HTML element.
alert ("The paragraph was clicked."); The click event occurs when an element is clicked. The click () method triggers the click event, or attaches a function to run when a click event occurs.
Move the <script>
block that registers the click event outside of the popup
div, I think the JS gets parsed another time when the div becomes visible...
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