How to load php page with fancybox? [closed]

问题

It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center.

Closed 7 years ago.

I searched a lot but I can't find an answer.

In my contact.php I have this code:

<a class="mailform" href="submit.php">Click</a>

I have this script, but it doesn't work:

$('.mailform').click(function() {
     $.fancybox(
        {
            'autoDimensions'    : false,
            'width'                 : 350,
            'height'                : 'auto',
            'transitionIn'      : 'none',
            'transitionOut'     : 'none',
            'ajax'   : {
              cache   : false,
              url     : this.href
             }
        }
    );
});

Can you help me please?

回答1:

You need to return false to stop the link from following through

$('.mailform').click(function() {

     var myUrl = $(this).attr('href');

     $.fancybox(
        {
            'autoDimensions'    : false,
            'width'             : 350,
            'height'            : 'auto',
            'transitionIn'      : 'none',
            'transitionOut'     : 'none',
            'ajax'   : {
              cache   : false,
              url     : myUrl
             }
        }
    );

    return false;
});

回答2:

I suspect your problem here is related to the scope of the magic this variable. In your code, this is referring to the object literal that you have assigned to 'ajax':. In order to do what I think you are trying to do, you will need another temporary variable. By convention, we call the variable that. You also need to return false from your click handler, stop stop the browser from following the link in the main window.

$('.mailform').click(function() {
    // Here, `this` refers to the <a> DOM element, so we create a copy of it
    // and store it in `that`
    var that = this;
    $.fancybox({
        // Now `this` refers to the object you are passing to fancybox()
        'autoDimensions': false,
        'width'         : 350,
        'height'        : 'auto',
        'transitionIn'  : 'none',
        'transitionOut' : 'none',
        'ajax'          : {
            // Now `this` refers to the object you are assigning to 'ajax':
            cache   : false,
            url     : that.href // Use `that` instead of `this`
        }
    });
    // We also need to return false, to stop the browser following the link
    return false;
});

来源：https://stackoverflow.com/questions/10010390/how-to-load-php-page-with-fancybox