0

まず第一に、私はjqueryとajaxの初心者です。私がやろうとしているのは、リンク内のjsonファイル全体からのサンプルを表示することです。

http://soap.madarat.jo/Services/BusinessApplication1-DomainService1.svc/json/gettasks

サンプルを編集する可能性は何ですか、

 <!DOCTYPE HTML>
 <html>
 <head>
<title>json test</title>
<script src="js/json2.js" type="text/javascript"></script>
<script src="js/jquery-1.4.2.js" type="text/javascript"></script>
<script src="jtip.js" type="text/javascript"></script>

  <script type="text/javascript">

  function query() {
        var xmlhttp = new XMLHttpRequest();
        xmlhttp.open("GET", "http://soap.madarat.jo/Services/BusinessApplication1-       DomainService1.svc/json/gettasks", false);
        xmlhttp.send();
        var results = JSON.parse(xmlhttp.responseText);
        var html = '<ol>';
        alert(results.GetTasksResult);
        if (results.GetTasksResult != null) {
            var title;
            alert(results);
            for (var i = 0; i < results.GetTasksResult.RootResults.length; i++ ) {

                entity = results.GetTasksResult.RootResults[i];
                html += '<li>'+entity.DoctorID +' by <b>'+ entity.TaskNote +'</b></li> <br><br> ';
            }
            document.getElementById('results').innerHTML = html;
        }
    }



  </script>
 </head>
 <body>

    <button type="button" onclick="query()">jquery</button>
        <div id="results" />


</body>
</html>

しかし、ボタンをクリックしても何も起こりません。

なぜこうなった

ありがとうございました

4

1 に答える 1

0

リクエスターオブジェクトを正しく使用していません。あなたがしたのはリクエストを発行することだけですが、その応答を待ちませんでした。このコードは非同期で機能しますが、同期していると思っていたため、データを取得する前にデータの処理を開始しました。

jQueryを使用してAjaxリクエストを作成する

$.ajax({
   type: "GET",
   url: "http://soap.madarat.jo/Services/BusinessApplication1-DomainService1.svc/json/gettasks",
   success: function(data, status, xhr){
       data = data + "" == data ? $.parseJSON(data) : data;
       var el = $("#results").append("<ol></ol>").children("ol").first();
       if (data.GetTaskResult) {
           $.each(data.GetTaskResult.RootResult, function() {
               el.append("<li>" + this.DoctorID + " by <b>" + this.Tasknote + "</b></li>");
           });
       }
   }
});

これにはバグがあるかもしれませんが、コードとほぼ同じように動作するはずです。

さらに、あなたはjson2ライブラリを追加する必要はありません、そして私はあなたのjtipについて知りません。

私があなたに与えることができる最高のヒント

まず、使用しているライブラリについて理解してください。あなたの場合、それはjQueryになります。これにより、ブラウザーに依存しないAjaxコードを簡単に作成できます。そこにあるのに、あなたはそれを少しも使っていません。それを学び、それを使用してください。すべてのドキュメントを調べて、その使用方法とその使用が賢明な理由を確認するのに1日かかることはありません。

jQueryドキュメント

于 2012-04-11T20:57:57.487 に答える