1

適切に実装しようとしているため、クリックすると分割されたコンソールログの名前が関数で正しく表示されないようです。ここに表示されるこの未定義のエラーが表示されます。 ここに画像の説明を入力

ただし、エラーが発生しているコード "response.data[i]" は、コード (以下のリンクから) とこのスクリーンショットに見られるように、アンカー タグの html 側に正しく表示されています。

ここに画像の説明を入力

では、コンソール ログで名前を分割するためにクリックすると未定義になるのに、表示されると明らかに機能するのでしょうか? また、console.log(response.data); コマンドは、次に示すように response.data を明確に表示しています。

ここに画像の説明を入力

したがって、クリックするとコンソールログに名前が正しく表示されるようにこれを修正する方法がわかりません.2語の名前でも3語の名前でもかまいません。

コード：

function getGroupWall() {
    $("#groupUL").html("");
    FB.api('/421727124532461/feed', 'get', function(response){
        console.log(response.data);
        for (i=10, j=response.data.length; i<=j; i++) {
            function splitName(txt){
                var myString = txt;

                var mySplitResult = myString.split(" ");

                console.log("The first element is " + mySplitResult[0]); 
                console.log("<br /> The second element is  " + mySplitResult[1]); 
                console.log("<br /> The third element is  " + mySplitResult[2]); 

            };
            $("#groupUL").append("<li>" + "<h4>Item Description:</h4> " + response.data[i].message + "<br /> " + "<h2>Posted By:</h2> <a href='#' id='splitNames'>" + response.data[i].from.name + "</a>" + "<br />"+ "<h4># of Replys: </h4>" + response.data[i].comments.count + "<br />" +  "<a href='" + response.data[i].link + "' target='new' style='text-align:right;'>(external url)</a>" + "<br /> " + "<img src='"+response.data[i].picture+"'>" + "</li><br />");
            $("#splitNames").click(function(){ splitName(response.data[i].from.name) });
        }
    });
}
4

1 に答える 1

3

これは典型的な閉鎖問題です。

の値はi、response.data.lengthハンドラーclickが起動したときです。

次のように値をバインドする必要があります。i

$("#splitNames").click((function (i) { // extra "(" indicating immediate invocation
    // return an anonymous function that has a value for "i" in it's scope
    return function (event) { // event is the click event, or whatever is usually passed to it
        splitName(response.data[i].from.name)
    }
}(i))); // immediate invocation to bind "i"

これを行うこともできます：

$("#splitNames").click((function (item) {
    return function (event) {
        splitName(item.from.name)
    }
}(response.data[i])));

これが、クロージャーの仕組みを理解するのに役立つことを願っています。

于 2013-03-27T14:35:33.130 に答える