0

私はいくつかのajaxを学ぼうとしているので、基本的にいくつかのデータを取得するための名簿のコードを書きました。私のJavaScriptはごみですが、私が間違っていることを理解できないようです。エラーは関数ajaxCallを示していますが、その関数にも問題はありません。

(function () {
    var searchForm = document.getElementById("search-form"),
        searchField = document.getElementById("q"),
        getAllButton = document.getElementById("get-all"),
        target = document.getElementById("output");

    var addr = {
        search: function (event) {
            var output = document.getElementById("output");

            //start ajax call
            ajaxCall("data/contacts.json", output, function (data) {
                var searchValue = searchField.value,
                addrBook = data.addressBook,
                count = addrBook.length,
                i;

                //stop default behavior
                event.preventDefault();

                //clear target
                target.innerHTML = "";

                if (count > 0 && searchValue !== "") {
                    for (i = 0; i < count; i++) {
                        var obj = addrBook[i],
                            isItFound = obj.name.indexOf(searchValue);
                        if (isItFound !== -1) {
                            target.innerHTML += '<p>' + obj.name + ', <a href="mailto:' + obj.email + '">' + obj.email + '</a><p>';
                        } //end if isItFound
                    } //end for loop
                } //end if count check
            }); //end ajax call
        }, //end method search

        getAllContacts: function () {
            var output = document.getElementById("output");
            ajaxCall("data/contacts.json", output, function (data) {
                var addrBook = data.addressBook,
                        count = addrBook.length,
                        i;

                target.innerHTML = "";

                if (count > 0) {
                    for (i = 0; i < count; i++) {
                        var obj = addrBook[i];
                        target.innerHTML += '<p>' + obj.name + ', <a href="mailto:' + obj.email + '">' + obj.email + '</a><p>';
                    } //end for loop
                } //end if
            }); //end ajax call
        }, //end method getAllContacts
        setActiveSection: function () {
            this.parentNode.setAttribute("class", "active");
        }, //end method setActiveSection
        removeActiveSection: function () {
            this.parentNode.removeAttribute("class");
        }, //end method removeActiveSection
        addHoverClass: function () {
            searchForm.setAttribute("class", "hovering");
        }, //end method addHoverClass
        removeHoverClass: function () {
            searchForm.removeAttribute("class");
        } //end method removeHoverClass
    }   //end addr object  
    searchField.addEventListener("keyup", addr.search, false);
    searchField.addEventListener("focus", addr.addActiveSection, false);
    searchField.addEventListener("blur", addr.removeActiveSection, false);
    getAllButton.addEventListener("click", addr.getAllContacts, false);
    searchForm.addEventListener("submit", addr.search, false);
    searchForm.addEventListener("mouseover", addr.addHoverClass, false);
    searchForm.addEventListener("mouseout", addr.removeHoverClass, false);
})(); //end anon function

function getHTTPObject() {
    var xhr;

    //in most cases this first if is executed
    if (window.XMLHttpRequest) {
        xhr = new XMLHttpRequest();
    }
    //otherwise support crappy IE6 and below
    else if (window.ActiveXObject) {
        xhr = new ActiveXObject("Msxml2.XMLHTTP");
    }
    return xhr;
}

function ajaxCall(dataUrl, outputElement, callback) {
    //get ajax object
    var request = getHTTPObject();

    outputElement.innerHTML = "Loading...";
    request.onreadystatechange = function () {
        if (request.readyState === 4 && request.status === 200) {
            //good ajax response..now save it
            var contacts = JSON.parse(request.responseText);
                if (typeof callback === "function")
                    callback(contacts);
        }   //end upper if
    }   //end onreadystatechange

    request.open("GET", dataUrl, true);
    request.send(null);
}

javascript開発ツールは私unexpected token }に97行目を与え続けますが、それは非常に頻繁に変更されます。どこかに中括弧がありませんか？

4

2 に答える 2

1

コンソールで JSON 応答を再確認し、無効かどうかを確認する必要があります。その97行目で、応答を解析していると言っているからです。

于 2012-11-13T21:19:10.017 に答える
1

私はあなたのコードをこのフィドルに入れ、できる限りエラーを修正しました。中かっことセミコロンがいくつかありませんでした。また、宣言される前にajaxCall()andを使用しました。getHTTPObject()見てみな。残念ながら、問題がすでに修正されているかどうかはわかりませんが、コードは少なくとも有効です:)

ところで：（私の意見では）そのような長いコードサンプルは常にフィドルに貼り付けたほうがよいです。他の場所で完全なコード サンプルを参照しながら、おそらく厄介なコードに集中できるからだけでなく、ここで質問する前に jsLint を使用してコードをすばやく検証できるため、構文エラーがないことを確認できるからです。

于 2012-11-14T07:30:07.183 に答える