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元素的引用页面和对话框容器内的所有控件。此表单的action属性也指向spv14.aspx页面，没有任何根路径。有一些解决方案存在。让我们从最难以最简单的方面来检验它们：

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

结论：使用{{1}}选项的第三种方法是最原生且最轻松的解决方案。

P.S。抱歉我的英文：）

ColorBox弹出窗口没有击中代码

1 个答案: