2010-11-16 25 views
0

這應該是一個簡單的問題,但是現在答案已經一段時間了。我似乎在這段代碼中有一個錯誤,無論是腳本錯誤還是邏輯錯誤。你能否澄清我的問題?jQuery/AJAX代碼片段中的腳本錯誤?

下面的代碼:

function GetQuestion() { 
     $.ajax({ 
      type: "GET", 
      url: "questions.xml", 
      dataType: "xml", 
      success: function(xml) { 
       x = 0; 
       x = $(xml).find('Question').length; 

       var questionID = $.random(x); 

       $(xml).find('Question').each(function(){ 
        if(this.ID == questionID) { 
         var text = $(this).find('BODY').text(); 
         $('#questionBody')[0].innerHTML = text; 
        } 
       }); //close each 
      } //close success 
     });//close ajax 
    }; //close function GetQuestion 

它意味着在一個XML文件中讀取,搜索它具有隨機ID的具體項目,並BODY內容插到<p>我在我的HTML文件。但是,它沒有按預期工作。我在哪裏犯了一個錯誤?

感謝,埃利奧特博納維爾

+0

你*讓*任何錯誤?什麼是'$ .random()'? – 2010-11-16 00:26:09

+0

這是我下載的一個自定義函數。你想看看嗎?不,我沒有收到任何錯誤,甚至沒有發現Firebug。 – 2010-11-16 00:28:06

+0

是什麼問題。你說你似乎有一個錯誤,但沒有錯誤。那麼什麼不按預期工作? – Hamish 2010-11-16 00:36:46

回答

1

這只是一個普遍的觀察,並不是一個真正的答案,但它可能有幫助你將來:

//notice that this function is much easier to consume in one glance 
function GetQuestion() { 

    $.ajax({ 
     type: "GET", 
     url: "questions.xml", 
     dataType: "xml", 
     success: GetQuestionSuccess 
    });//close ajax 

}; //close function GetQuestion // <-superfluous semicolon? 



//notice that this function is much easier to consume in one glance 
function GetQuestionSuccess(xml) { 

    //let's quit querying each time we need them 
    var questions = $(xml).find('Question'); //bonus, it's a jQuery object! 

    //x = 0; // <-unnecessary assignment. It gets obliterated on the next line. 
    x = questions.length; //the count of all "Question"s found 

    var questionID = $.random(x); 

    //but wait, read my next comments below 
    questions.each(function(){ 
     if(this.ID == questionID) { 
      var text = $(this).find('BODY').text(); 
      $('#questionBody')[0].innerHTML = text; 
     } 
    }); //close each 

    //since you seem to be looking for the index questionID of all the questions, 
    //why not jump to that one instead of looping? 
    //also, if you only have one "#questionbody" in your document you can do this more "jquery"ish. 
    $('#questionBody')[0].innerHTML = questions[questionID].find('BODY').text(); 

    //only one: 
    $('#questionBody').html(questions[questionID].find('BODY').text()); 

} //close success 

所以澄清:\

//I shredded it down to a reasonable number of lines. Could be shorter still, albeit less readable. 
//but I think this is pretty readable. 
function GetQuestionSuccess(xml) { 

    var questions = $(xml).find('Question'); 

    var questionID = $.random(questions.length); 

    $('#questionBody').html(questions[questionID].find('BODY').text()); 

} //close success 
+0

感謝您的觀察。看起來你在這個答案中付出了更多的努力,所以我接受了它而不是另一個,因爲這兩個問題實際上都沒有解決這個問題,這實際上讓我感到沮喪,而是放在其他地方。感謝您爲此付出的時間。 – 2010-11-16 02:42:40

+0

@ElliotBonneville〜非常感謝,我想。我真的沒有花太多的時間去寫它,大約花了三倍的時間輸出它,在60wpm時間並不長......我只是覺得你可能希望看到更簡單的代碼重構已經把事情略微調高了一點(失去了這種說法)。所以你在其他地方發現了問題?小心分享真正導致你悲傷的事情嗎? – jcolebrand 2010-11-16 15:07:12

+0

我想。但首先,想一想:每個程序員至少有一個「Do'h !!」在他/她的生活中的一刻。這是我的;我根本沒有在正確的目錄中的XML文件。畢竟,我的代碼可能工作得很好。不過,你的工作更好。我可能會實施它。 – 2010-11-16 19:53:40

0

假設你的XML看起來是這樣的(因爲你沒有張貼)(在標籤注意大小寫敏感性試驗)

<?xml version="1.0" encoding="ISO-8859-1"?> 
<questionlist> 
<Question ID='0'> 
<BODY> 
Are you 1? 
</BODY> 
</Question> 
<Question ID='1'> 
<BODY> 
Are you 2? 
</BODY> 
</Question> 
<Question ID='2'> 
<BODY> 
Are you 3? 
</BODY> 
</Question> 
<Question ID='3'> 
<BODY> 
Are you 4? 
</BODY> 
</Question> 
<Question ID='4'> 
<BODY> 
Are you 5? 
</BODY> 
</Question> 
<Question ID='5'> 
<BODY> 
Are you 6? 
</BODY> 
</Question> 
<Question ID='6'> 
<BODY> 
Are you 7? 
</BODY> 
</Question> 
</questionlist> 

然後你可以使用的這款改裝版你的代碼...

<html> 
<head> 
     <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.3.min.js"></script> 
     <script type="text/javascript"> 


function GetQuestion() { 
     $.ajax({ 
      type: "GET", 
      url: "questions.xml", 
      dataType: "xml", 
      success: function(xml) { 
       x = 0; 
       x = $(xml).find('Question').length; 
       var questionID = Math.floor(Math.random() * x); 

       $(xml).find('Question').each(function(){ 
        if($(this).attr('ID') == questionID) { 
         var text = $(this).find('BODY').text(); 
         $('#questionBody').html(text); 
        } 
       }); //close each 
      } //close success 
     });//close ajax 
    }; //close function GetQuestion 

     $(document).ready(function(){ 
     GetQuestion(); 
     }); 
     </script> 
</head> 
<body> 
<div id="questionBody"></div> 
</body> 
</html> 

我改變了$ .random方法,我並未有這樣的方法,所以我用普通JS,我改變this.ID使用jQuery選擇檢查id屬性,並且我改變了你的innerHTML行以使用jquery html()函數。代碼唯一的問題是事實上,你依靠的事實,你會有ID的n - 1條目的問題...