0

jquery 1.9.1 を使用した次の JavaScript コードがあります。

(function ($) {
$(function () {
    eventTracking();
});

function eventTracking() {
    $("[data-formtracking]").bind('submit', function (e) {
        e.preventDefault();
        var eventName = $(this).data("formtracking");
        rt.trackEvent(eventName);
        $(this).unbind('submit').submit();
    });
}})(jQuery);

ここで、フォームを送信すると、データベースが更新され、フォーム上のアクションに従って、基本的に別のページにリダイレクトされます。

Chrome/IE では rt.trackEvent が正常に起動し、他のサイトにリダイレクトされます。Firefox では、別のサイトにリダイレクトされますが、データベース エントリはありません。

各ステートメントの間に console.log を追加すると、すべてのログ ステートメントにヒットしていることがわかります。

だからこの時点で....私は困惑しています。バインドからオン/オフに切り替えてみました。私は試しました: $('input[type=submit]', this).click() 別のスタックオーバーフローページでコメントを渡すことに基づいています。

いくつかの注意事項: * rt は外部ファイルにあります。確認しましたが、存在します * unbind.submit を削除すると、rt.trackEvent は正しく機能しますが、ページが (明らかに) リダイレクトされません。* unbind.submit() を他のバリエーションに変更しましたが、送信する前にボタンを 2 回クリックする必要があります。

考え？

更新しました

e.preventDefault() 以降の送信の理由は、フォームの送信が速すぎたためです。rt.trackEvent が正しく機能する前に、ページがリダイレクトされます。そのため、 setTimeout($(this).unbind('submit').submit(), 2000); を追加してメソッドの速度を落とす必要がありました。

コードを簡素化するためにこれを削除しましたが、コードの動作には非常に重要です。

更新された 2 呼び出されている json は次のとおりです。

        options = $.extend({ success: $.noop, error: $.noop, urlBuilder: getNoCookieRequestURL, eventName: null }, options);

        options.url = options.urlBuilder(options.url, options.siteId, options.eventName);
        $.getJSON(options.url, function (jsonp) {
            options.success(jsonp);
        }).fail(function () {
            options.error();
        });

更新 3

getJson を次のように変更します。

            options = $.extend({ success: $.noop, error: $.noop, urlBuilder: getNoCookieRequestURL, eventName: null }, options);

        options.url = options.urlBuilder(options.url, options.siteId, options.eventName);

        $.ajax({
            url: options.url,
            dataType: 'json',
            async: false,
            success: function (jsonp) {
                options.success(jsonp);
            },
            error: function() {
                options.error();
            }
        });

私はまだ速度の問題を抱えているようです。コードは Chrome でステップ実行すると機能しますが、実行しただけではデータベースが適切に更新されません。

4

2 に答える 2

1

バインドを解除せずに、送信してください。

// $(this).unbind('submit').submit();
this.submit();

とにかく提出するだけなのに、なぜそもそも提出を妨げているのだろうか。

(function ($) {
$(function () {
    eventTracking();
});

function eventTracking() {
    $("[data-formtracking]").bind('submit', function (e) {
        //e.preventDefault();
        var eventName = $(this).data("formtracking");
        rt.trackEvent(eventName);
        //$(this).unbind('submit').submit();
    });
}})(jQuery);
于 2013-11-12T21:36:49.257 に答える
0

これが世界で最も美しいかどうかはわかりませんが、今では動作します....これは大きな改善です.

    $("[data-formtracking]").bind('submit', function (e) {
        e.preventDefault();
        form = this;
        var eventName = $(this).data("formtracking");
        rt.trackEvent(eventName);

        setTimeout(function() {
            form.submit();
        }, 100);
    });

基本的には、jquery を使用したバインド解除と再送信に問題があるように思われたので、それを回避し、代わりに JavaScript の送信を使用しました。

于 2013-11-13T16:19:10.783 に答える