Question

I’m using jQuery + one click event + <a href... class="opener"> (you can see code below) and there’s small bug: pop-up form is loading only once, but only for each url. I mean that form should load itself only once per page loading, but not per <a href... pressing. So how to fix it? 🙁

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css" type="text/css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
        var $dialog = $('<div></div>')
        .html('Hello, World')
        .dialog({
            autoOpen: false,
            title: 'Hey!'
        });
    $('a.opener').one('click', function() {
        $dialog.dialog('open');
        return false; 
    });
});
</script>

Usage: <a rel="nofollow" href="http://url.example" class="opener">Strange Text</a>, <a rel="nofollow" href="http://url2.example" class="opener">Strange Text #2</a>, etc

Answer 1

If you want it to fire once per page, I’d just unbind it after:

$('a.opener').click(function(e) {
    e.preventDefault();
    $("a.opener").unbind(e);
    $dialog.dialog('open');
});