5

我有以下代码：

    $(".foo-form").submit(function (event) {
        event.stopPropagation();
        event.preventDefault();
        $.ajax({
            url: this.action,
            data: $(this).serializeArray(),
            type: 'POST',
            dataType: 'json',
            success: function (data, msg, resp) {
                var $form = $("#second-form");
                $form.show().dialog({
                    resizable: false,
                    height:400,
                    width: 600,
                    modal: true,
                    title: "Recommendation added",
                    buttons: [
                        {
                            text: "OK",
                            click: doOK
                        },
                        {
                            text: "Cancel",
                            click: doCancel
                        }
                    ]
                });
            }
        })
        return false;
    });

如果我在页面上向下滚动并提交表单，当显示对话框时，它会将页面滚动到顶部。有没有办法覆盖这个？

不是解决方案的事情

  • 固定.ui-dialog班级的定位。未修改（使用 Google 的 CDN）
  • 不取消事件 - 如您所见，我调用,stopPropagation并返回false。所以这并不是事件正在发生（即使是这样，它也不是指向页面顶部的哈希链接）preventDefault

使用 jQuery 1.72 和 jQuery UI 1.8.21（各自的最新版本）。

4

5 回答 5

6

I had the same issue using jQuery dialog with href tags and I fix it adding "event.preventDefault();" when I invoque the dialog, example:

$(".button").click(function(event){
event.preventDefault();
$("#dialog").dialog();
});
于 2013-09-16T17:35:21.617 回答
3

我在使用带有 href 标签的 jQuery 对话框时遇到了类似的问题。我所要做的就是从 a 标签中删除 href="#" ，这解决了我的问题。

更改<a href='#'>SHOW</a>为<a>SHOW</a>

于 2013-02-10T01:23:14.163 回答
0

我发现最好的解决方法是返回 false；打开对话框后。

所以把你的回报移到假；在对话框功能之外。我知道这是一个老问题，但在这里没有看到这个解决方案，它对我有用。

您的 stopPropagation、preventDefault() 和返回 false 的问题；是他们都在错误的地方。

我就是这样做的。

   $("<div><p>" + text + "</p></div>").dialog({
        modal: true,
        resizable: false,
        width: width,
        buttons: {
            Ok: function() {
                $(this).dialog("close");
            }
        }
    });
    return false;
于 2015-02-03T13:53:42.020 回答
0

尝试添加关闭功能并在内部使用 preventDefault ，为我工作

$form.show().dialog({
                close: function (event) { event.preventDefault(); }
                resizable: false,
                etc....
            });
于 2014-09-09T15:12:04.567 回答
-1

它因为<a href=""></a>标签而滚动。

利用

<a class="someClass" href=#!"></a>

防止滚动到顶部

于 2016-07-15T12:57:15.037 回答