Question

I want to be able to load an url only once after clicking a button. I have this:

$("#button").click(function () { 
      $("#frame").attr("src", "http://www.google.com/");
});

Unfortunately this loads the iframe every sigle time I click the button. This is the complete code: JS Bin

Answer 1

replace .click() with .one('click', function() {

However, that would leave the button without any functionality afterwards, so you might want to remove or disabled it aswell in the event handler.

In case you only want to “temporarily” disable the button while the <iframe> is loading, do it like this:

var myClickHandler = function myClickHandler() {
    $(this).unbind( myClickHandler );

    $('#frame').attr('src', 'http://www.google.com').load(function() {
        $('#button').click( myClickHandler );
    });
};

$('#button').click( myClickHandler );