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、 、preventDefault、およびfalse を呼び出します。したがって、イベントが進行しているわけではありません (たとえ進行中だったとしても、ページの上部へのハッシュ リンクではありません)。

jQuery 1.72 および jQuery UI 1.8.21 (それぞれの最新バージョン) を使用します。

4

5 に答える 5

6

href タグを含む jQuery ダイアログを使用して同じ問題が発生し、 「event.preventDefault();」を追加して修正しました。ダイアログを呼び出したときの例:

$(".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

close の関数を追加して、内部で preventDefault を使用してみてください。

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

私が見つけたこれに対する最良の修正は、falseを返すことです。ダイアログを開いた後。

したがって、 return false; を移動するだけです。ダイアログ機能の外。これは古い質問であることは知っていますが、ここでこの解決策が見られなかったので、うまくいきました。

stopPropagation、preventDefault()、および return 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 に答える
-1

<a href=""></a>タグのせいでスクロールします。

使用する

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

上にスクロールしないようにするには

于 2016-07-15T12:57:15.037 に答える