3

私はこの非常に単純なjQuery関数を持っています:

$(".milestone-in-tree").live({
    mouseenter: function() {
        setTimeout(
        $.ajax({
            type: "GET",
            url:"/projects/pmnodes/" + $(this).data("pmnode") + "/addbuttons.js"
        }),5000)
    },
    mouseleave: function() {
        $(".grid-btn").delay(800).remove();
    }
});

AJAXリクエストをサーバーに送信する前に5秒待機させたいのですが、待機せず、すぐに送信します。なんで？

アップデート：

すべてのフィードバックに感謝します。すべての回答で提案されているように、関数を変更しました：

$(".milestone-in-tree").live({
    mouseenter: function() {
        var node = $(this).data("pmnode")
        setTimeout(function() {
        $.ajax({
            type: "GET",
            url:"/projects/pmnodes/" + node + "/addbuttons.js"
        }),5000});
    },
    mouseleave: function() {
        $(".grid-btn").delay(800).remove();
    }
});

しかし、私はまだ遅れることはありません。私が誤解したことはありますか？PS: ノード変数を作成したのは、無視する理由により、SetTimeout 匿名関数内で $(this) にアクセスできなくなったためです。

更新 2

最後に、なんとか遅延を取得できましたが、その間に mouseleave イベントがトリガーされたとしても、遅延の後もリクエストがまだサーバーに送信されていることに気付きました...

回避策を見つけることができました。全然違います。遅延はもう機能しませんが、Ajax リクエストは mouseleave イベントで中止されます。これは私が本当に必要としていたものです。興味があるかもしれない人のために、これはコードです：

var button_request;
$(".milestone-in-tree").live({
    mouseover: function() {
        var node = $(this).data("pmnode");
        button_request = $.ajax({
                        type: "GET",
                        url:"/projects/pmnodes/" + node + "/addbuttons.js"
                    });
        setTimeout(function() {button_request;},5000)
    },
    mouseleave: function() {
        if (button_request) {
            button_request.abort();
            button_request = null;
                }
        $(".grid-btn").remove();
    }
});

もちろん、 setTimeout は削除できますが (機能しないため...)、わかりやすくするために残します。

みんな、ありがとう。

4

7 に答える 7

7

これを試して：

$(".milestone-in-tree").live({
    mouseenter: function() {
        var pmnode = $(this).data("pmnode"); // cache the data in a variable
        setTimeout( function() { // this function(){...} wrapper is necessary
            $.ajax({
                type: "GET",
                url:"/projects/pmnodes/" + pmnode + "/addbuttons.js"
            })
        },5000)
    },
...

呼び出しの最初の引数はsetTimeout()、文字列 (実際にはすべきではありません) または自己完結型の関数オブジェクトのいずれかである必要があります。

$.ajax(...)代わりに配置することで、JavaScript に (1) すぐに実行し、(2) ajax 関数が返すものとして最初の引数を設定するように指示します。これはdocsによると、setTimeout何もできないjqXHRオブジェクトです。と。

orを使用するたびfunction(){...}に、最初の引数として匿名を使用する習慣を身につければ、問題ありません。setTimeout()setInterval()

于 2012-06-18T15:34:59.940 に答える
6

setTimeout()evalJavascriptコードの文字列（非常に悪い習慣、追加するかもしれません）、または指定された時間の後に呼び出す関数参照のいずれかを受け入れます。

ここで行っていることはどちらでもありません --- の最初のパラメーターとして関数を呼び出していますsetTimeout()。その為、待ちません。

あなたがしたい：

setTimeout(function () {
    $.ajax({});
}, 5000);

次のような違いがあります。

setTimeout(foo, 1000);

と

setTimeout(foo(), 1000);
于 2012-06-18T15:36:00.023 に答える
5

$.ajax()関数を呼び出して、その呼び出しによって返されたものを に渡しますsetTimeout()。無名関数でラップする必要があります。

setTimeout(function() {
    $.ajax({
        type: "GET",
        url:"/projects/pmnodes/" + $(this).data("pmnode") + "/addbuttons.js"
    })
},5000);
于 2012-06-18T15:35:14.397 に答える
2

無名関数でラップします。

setTimeout(function(){
        $.ajax({
            type: "GET",
            url:"/projects/pmnodes/" + $(this).data("pmnode") + "/addbuttons.js"
        });
},5000)
于 2012-06-18T15:35:01.260 に答える
2

すぐに呼び出して、関数コールバックに入れます:

   setTimeout( function() {
    $.ajax({
        type: "GET",
        url:"/projects/pmnodes/" + $(this).data("pmnode") + "/addbuttons.js"
    })
   } ,5000)
于 2012-06-18T15:35:31.260 に答える
1

渡すコードは実際に実行されています。最初の引数内でコードを実行したい場合は、関数でラップする必要があります。

$(".milestone-in-tree").live({
    mouseenter: function() {
        setTimeout(
function(){
        $.ajax({
            type: "GET",
            url:"/projects/pmnodes/" + $(this).data("pmnode") + "/addbuttons.js"
        }),5000);
}
    },
    mouseleave: function() {
        $(".grid-btn").delay(800).remove();
    }
});
于 2012-06-18T15:35:08.467 に答える
1

が必要function()です：

setTimeout(function(){
        $.ajax({
        ...
}, 5000)
于 2012-06-18T15:35:20.423 に答える