1.
2.JSON.parse() 方法用于将一个 JSON 字符串转换为对象。
$("body").on("click","#analyze",function(){ $("#modal").modal("show"); var url = "chartData"; $.ajax({ header:{ Accept:"application/json; charset=utf-8" }, method: 'get', url: url, success:function(data){ data = JSON.parse(data); console.log(data); var html1 = template("standard-lists",data); $("#standard-answer").html(html1); var html2 = template("studentanswer-lists",data); $("#student-answer").html(html2); } }) });
3.循环,判断
<tbody id="student-answer"> <script type="text/html" id="studentanswer-lists"> {{each sourceAndVoiceMusicList as sa}} {{if sa.noteIsTrue==false}} <tr class="anerror"> {{/if}} {{if sa.noteIsTrue==true}} <tr> {{/if}} <td>{{sa.voiceNoteName}}</td> <td>{{sa.rectifyNote}}</td> <td>{{sa.voicePitchToFreq}}</td> <td>{{sa.voiceNoteLength}}</td> {{if sa.noteIsTrue==true}} <td><span class="answer-right"></span></td> {{/if}} {{if sa.noteIsTrue==false}} <td><span class="answer-error"></span></td> {{/if}} {{if sa.lengthIstrue==false}} <td><span class="answer-error"></span></td> {{/if}} {{if sa.lengthIstrue==true}} <td><span class="answer-right"></span></td> {{/if}} </tr> {{/each}} </script> </tbody>
4.没有循环的数据显示格式
<script type="text/html" id="cardinal-list"> <p>音符总数:{{noteCount }}</p> <p>音高正确数:{{noteNo}}</p> <p>音长正确数:{{lengthNo}}</p> <p>音准正确数:{{trueNO}}</p> <p>准确率:{{accuracy*100+"%"}}</p> </script>
5.后台给的数据
{ "trueNO": 47.5, "voiceMusicList": [ { "rectifyNote": 12, "pitchToFreq": 221, "absoluteTime": 16976, "noteLength": 228, "sequenceNo": 45, "noteName": "A4", "noteIsTrue": true, "noteNumber": 57, "lengthIstrue": false } ], "sourceAndVoiceMusicList": [ { "rectifyNote": 12, "pitchToFreq": 263, "voicePitchToFreq": 130, "sequenceNo": 15, "sourceNoteLength": 424, "voiceNoteName": "C4", "noteIsTrue": true, "voiceNoteLength": 1008, "sourceNoteName": "C5", "virtualFreq": 131, "lengthIstrue": true }, { "rectifyNote": 0, "pitchToFreq": 221, "voicePitchToFreq": 0, "sequenceNo": 20, "sourceNoteLength": 464, "voiceNoteName": "", "noteIsTrue": false, "voiceNoteLength": 0, "sourceNoteName": "A4", "virtualFreq": 110, "lengthIstrue": false } ], "noteNo": 57, "noteCount": 76, "accuracy": 0.625, "sampleSpeed": 80, "sourceMusicList": [ { "pitchToFreq": 263, "absoluteTime": 20288, "noteLength": 424, "sequenceNo": 15, "noteName": "C5", "noteNumber": 60, "virtualFreq": 131 }, { "pitchToFreq": 221, "absoluteTime": 26744, "noteLength": 464, "sequenceNo": 20, "noteName": "A4", "noteNumber": 57, "virtualFreq": 110 } ], "lengthNo": 52, "voiceSpeed": 80 }