1

これをどのように定式化するかはわかりませんが、ここにあります。

var が存在するかどうか (コンテンツ) を確認していますが、設定されていない場合は確認しています。

問題は次のクリックです。それでも var コンテンツがないかのように動作します。しかし、なぜ？？

ここに私のコード：

$("#nav a").click(function(event) {
    event.preventDefault();
    var href = $(this).attr("href");
    var load = href + " .content";
    if (!content)
    {
        var content = $('<div>').load(load);
        $(".content").append(content);

    } 
    else 
    {
        var position = content.offset();
        $(document).scrollTop(position);

    }
});

他に結果が生じることは決してないため、常にクリックが行われ、ロードと追加機能全体が繰り返されます。

基本的に、この特定のリンクのコンテンツが一度読み込まれたことを記録するにはどうすればよいので、次回はelse関数を実行する必要がありますか?

また、私の if(!content) ステートメントの何が問題になっていますか? スコープのせいですか？

4

3 に答える 3

3

Javascript 関数では、オブジェクトのスコープを決定します。コンテンツをグローバル スコープに配置する必要があります。現在、クリック イベント ハンドラーに割り当てられた匿名関数内で作成されているため、関数が再度実行されると、コンテンツがスコープ外になり、false が返されます。

var content;
$("#nav a").click(function(event) {
    event.preventDefault();
    var href = $(this).attr("href");
    var load = href + " .content";
    if (!content)
    {
        content = $('<div>').load(load);
        $(".content").append(content);

    } 
    else 
    {
        var position = content.offset();
        $(document).scrollTop(position);

    }
});
于 2013-05-10T16:33:11.610 に答える
2

var content現在行っているように、ローカル変数ではなくグローバル変数として作成してみてください。そのためif (!content)、次のように常に結果が trueになります。

var content;
$("#nav a").click(function (event) {
    event.preventDefault();
    var href = $(this).attr("href");
    var load = href + " .content";
    if (!content) {
        content = $('<div>').load(load);
        $(".content").append(content);
    } else {
        $(document).scrollTop(content.offset());
    }
});

contentの値が最初に設定されておらず、次に再度設定された場合に何が起こるかを示すために:

var content;
console.log(content);  // undefined 
console.log(!content); // true 

content = 'text';
console.log(content);  // text  
console.log(!content); // false
于 2013-05-10T16:33:41.550 に答える
0

var が存在するかどうかのチェックに関する最初の質問に答えてくれてありがとう。

私は結局、このコンセプト全体を捨ててしまいました。

one()

関数は私がずっと必要としていたものです。関数を一度だけ実行し、その後のすべてのクリックで別の関数を実行するため。

ここにあります：

$(document).ready(function() {
    //Ajaxify Navi
        $("#nav a").one("click", function(event) {
            event.preventDefault();
            var href = $(this).attr("href");
            var load = href + " .content";
            var content = $('<div>').load(load);
            $(".content").append(content);
            $(this).click(function(event) {
                event.preventDefault();
                var position = content.offset().top;
                $(document).scrollTop(position);
                $("body").append(position);
            });
        });
});

これはどういうことかというと、次のとおりです。

ボタンを 1 回クリックすると、ajax を介してコンテンツが読み込まれ、追加されます。同じボタンを 2 回クリックすると、そのコンテンツにスクロールするだけです。

于 2013-05-10T18:45:11.270 に答える