Jquery colorbox - 在现有颜色框内重定向/转发 [英] Jquery colorbox - redirect/forward inside existing colorbox

查看:61
本文介绍了Jquery colorbox - 在现有颜色框内重定向/转发的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

所以我装了一个彩盒。我希望能够重定向/转发到现有颜色框内的另一个页面。

So I have a colorbox loaded. I'd like to be able to redirect/forward to another page inside the existing colorbox.

window.location = href; 在这里不起作用。

编辑:更具体一点,我想拦截表单提交,并在必要时重定向。

Being more specific, I want to intercept a form submit, and redirect if necessary.

    $("#search-center-form").live("submit", function () {
        alert('clicked');
        $.post('myurl', function(data) {
            console.log(data);
            if (data) {
                $.colorbox({href:'http://www.google.com/'});
            }
                }, 'json');
        return false;
    });

原始颜色框是这样打开的:

The original colorbox is opened up like so:

$.fn.colorbox({'href': block, 'open':true, 'inline':true, 'width':'530px', 'height':'260px'});

现在我正在尝试将外部URL加载到该颜色框中。我想AJAX是一个选项,但如果你可以在彩盒中加载iFrame,这应该是可能的,不应该吗?

And now I'm trying to load an external URL into that colorbox. I suppose AJAX is an option but if you can load an iFrame in a colorbox, this should be possible too shouldn't it?

谢谢!

推荐答案

你几乎就在那里,但有几个原因导致代码无效。

You're almost there, but there's a couple reasons why that code isn't working.

一个是你试图在没有适当选项的情况下从另一个域加载内容。为此,您需要设置 iframe:true width 高度。如果您要加载自己域中的内容,则可能不需要 iframe 选项(然后colorbox将能够自动确定宽度和高度)。如果加载了所有必需的css或js,那么您不需要它。如果您的新网页在< head> 中有一些尚未加载的css或js,那么您将需要iframe。

One is that you are trying to load content from another domain without the proper options. In order to do that, you need to set the iframe:true, width, and height. If you are loading content from your own domain, then you may not need the iframe option (and then colorbox will be able to automatically determine width and height). If all the necessary css or js is loaded, then you don't need it. If your new page has some css or js in its <head> that's not already loaded, then you'll need the iframe.

另一个问题不是错误,而是Google如何处理请求。也就是说,在iframe加载他们的网站的情况下,他们没有;他们会阻止请求,因此您将无法使用google与colorbox(没有创意处理)。顺便说一句,虽然处理方式不同,但stackoverflow也不允许这样做,所以不要把它放在任何一个。

The other problem is not a mistake, but how google handles requests. Which is to say in the case of loading their site in an iframe, they don't; they will block the request, so you will not be able to use google with colorbox (without creative handling). Incidentally, although it's handled differently, stackoverflow won't allow it either, so don't bother putting that one in either.

无论如何,你的颜色盒重定向(在你的帖子回调)应该是这样的:

In any case, your colorbox redirect (in your post callback) should look like this:

$.colorbox({href:'http://www.yahoo.com', iframe:true, width:"75%", height: "75%"});

这篇关于Jquery colorbox - 在现有颜色框内重定向/转发的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆