ColorBox弹出窗口未命中后台代码

Question

我正在使用ColorBox jQuery plugin，但我遇到了一个奇怪的问题。下面是我的代码：

<script>
            $("#spv14DL").colorbox({width: "500px",
                                 height:"500px" });
</script>
...
<a href="/popups/spv14.aspx" id="spv14DL">Open this popup!</a><br />

当我点击链接时，一切都会像预期的那样打开。但是，当我点击aspx页面上的一个按钮时，它从来没有命中我的spv14.aspx代码，它会重定向到baseUrl.com/spv14.aspx而不是baseUrl.com/popups/spv14.aspx，这会导致404错误。

我做错了什么会导致这种行为吗？

Answer 1

错误原因是默认情况下，colorbox插件通过异步GET请求获取引用页面的内容，并将其放入对话框容器中。因此，如果您在打开对话框时检查页面的标记，您会发现在对话框容器中有一个包含form元素和所有控件的引用页面的内容。此外，表单操作属性引用没有任何根路径的spv14.aspx页面。实际上，有几种解决方案。让我们从最难的到最简单的来研究它们：

1. 您可以通过以下方式更改spv14.aspx页面的form元素的操作属性：action="\popups\spv14.aspx"。此解决方案的缺点是，在回发操作后，用户将被重定向到弹出页面。如果Response.Redirect属性返回true值：if(IsPostBack) { Response.Redirect(Request.UrlReferrer.ToString(), false); }，则可以通过在弹出页面的PreRender方法中调用IsPostback方法来修复此差距。在我看来，这个解决方案看起来并不是很好。
2. ，你可以在提交按钮点击弹出表单时取消post back，并使用异步请求来弹出页面静态方法，传入所有你需要执行操作的控件的值。在这种情况下，你不能在服务器代码中使用页面的ViewState和控件属性。
3. 的最后一个但并非最不重要的解决方案是在对话框元素容器中使用内联框架并将iframe: true选项传递给colorbox插件来显示弹出页面。这是在对话框中使用所有aspx页面内容的最简单的方式。

结论:使用iframe选项的第三种方法是最自然、最简单的解决方案。

另外，我的英语很抱歉:)