javascript - 提交 iframe 内的表单时需要 jQuery UI 对话框 "window"滚动到顶部

Question

我可能把事情复杂化了，但作为整个过程的新手，我不知道还能做什么。我在 iframe 中有一个订单表单，它位于 jQuery UI 对话框灯箱中。一切正常，除了一个问题:当表单被提交并重定向到感谢页面或错误页面时，它会滚动到底部。

我试过在致谢页面和错误页面的标签中使用 onload="window.parent.scroll(0,0);"，但没有任何效果。

还试过:

<script type="text/javascript">
    $("#orderform").onsubmit(function() {
     $("#dialog").window.scrollTo(0,0);
     alert('triggered');
    });
</script>

我把脚本放在我能想到的任何地方，索引页面、对话框内部、iframe 内部、表单页面中，甚至从未收到警报。

当前托管站点的测试服务器是http://kinnill.com/dev/bluehydrangea/

Answer 1

不确定要滚动到顶部的页面。对话框，对话框所在的页面，还是 iframe 中的页面？

看了你的代码后，我相信这就是你想要的:

如果对话框有一个在 iframe 更改后已经向下滚动的可滚动元素，那么您将希望定位任何具有“overflow: auto”的元素。如果该元素是#dialog，则在表单所在的 iframe 页面上执行此操作(在您的情况下看起来是 form.php):

<script type="text/javascript">
  $(function(){
    $("#orderform").submit(function() {//note: in jquery the onsubmit event is called "submit"
       $('#dialog', window.parent.document).scrollTop(0);//target #dialog from the parent window
       alert('triggered');
    });
  });
</script>

其他可能的解决方案供其他人引用:

如果它是对话框所在的页面，则执行以下操作:

如果表单在 iframe 中，则代码需要在 iframe 中。然后您需要修改代码以定位父窗口。

这应该是您正在寻找的:

<script type="text/javascript">
    $("#orderform").submit(function() {
     $(window.parent).scrollTop(0);
     alert('triggered');
    });
</script>

如果您要滚动的页面是感谢页面或错误页面，则将以下内容放在感谢页面和错误页面上:(您将需要在感谢页面和错误页面上使用 jquery)

<script type="text/javascript">
    $(function(){
       $(window).scrollTop(0);
    });
</script>