2016-11-28 63 views
1

此代码应该:找到匹配所选按钮的日期(例如,星期一)的对象课程,然后;根据开始时间对列表进行排序。由于对象中信息的性质,我将它们转换为军事等值用于比较目的。一旦完成后,它应该最终显示具有在声明中指定的信息的已排序课程列表。JSON/JavaScript功能/实现

但是,当我选择一个按钮时,什么也没有发生。没有显示任何内容,编译时也不会在代码中发现任何错误。

var courses = [ 
    { 
    "dept": "CSC", 
    "id": "3102", 
    "instructor": "Kooima", 
    "Location": "230 Turead", 
    "Start_Time": "1130", 
    "End_Time": "1230", 
    "Attendance": "Tuesday", 
    "Full_Name": "Advanced Data Structures and Algorithm Analysis" 
    }, 
    { 
    "dept": "CSC", 
    "id": "1200", 
    "instructor": "Duncan", 
    "Location": "420 PFT", 
    "Start_Time": "1030", 
    "End_Time": "1130", 
    "Attendance": "Monday", 
    "Full_Name": "Ethics in Computer Science" 
    }, 
    { 
    "dept": "CSC", 
    "id": "4330", 
    "instructor": "Mahmoud", 
    "Location": "150 Coates", 
    "Start_Time": "12:30", 
    "End_Time": "1:30", 
    "Attendance": "Thursday", 
    "Full_Name": "Software Systems Development" 
    }, 
    { 
    "dept": "MATH", 
    "id": "1550", 
    "instructor": "Tom", 
    "Location": "012 Lockett", 
    "Start_Time": "12:30", 
    "End_Time": "1:30", 
    "Attendance": "Wednesday", 
    "Full_Name": "Calculus" 
    }, 
    { 
    "dept": "ENGL", 
    "id": "2000", 
    "instructor": "McKinnon", 
    "Location": "012 Allen Hall", 
    "Start_Time": "9:30", 
    "End_Time": "10:30", 
    "Attendance": "Friday", 
    "Full_Name": "English Composition" 
    }, 
    { 
    "dept": "THTR", 
    "id": "1020", 
    "instructor": "King", 
    "Location": "619 MDMA", 
    "Start_Time": "8:30", 
    "End_Time": "9:30", 
    "Attendance": "Wednesday", 
    "Full_Name": "Introduction to Theatre" 
    } 

]; 

var courseDayList = new Array(); 

function converTime(time) { 
    var numericTime = 0; 
    if (time == "8:30") numericTime = 830; 
    if (time == "9:30") numericTime = 930; 
    if (time == "10:30") numericTime = 1030; 
    if (time == "11:30") numericTime = 1130; 
    if (time == "12:30") numericTime = 1230; 
    return numericTime; 
} 

function showCourseFromDay(day) { 
    var i; 
    for (i = 0; i<courses.length; i++) { 
    var course = courses[i]; 
    console.log(course); 
    if (course.Attendance == day) { 
     courseDayList.push(course); 
    } 
    } 
    courseDayList.bubbleSort = new function() { 
    var swapped; 
    do { 
     swapped = false; 
     for (var i = 0; i < courseDayList.length - 1; i++) { 
     var time1 = convertTime(courseDayList[i].Start_Time); 
     var time2 = convertTime(courseDayList[i + 1].Start_Time); 
     if (time1 > time2) { 
      var temp = courseDayList[i]; 
      courseDayList[i] = courseDayList[i + 1]; 
      courseDayList[i + 1] = temp; 
      swapped = true; 
     } 
     } 
    } while (swapped); 
    } 
    courseDayList.bubbleSort(); 
    courseDayList.printCourses = new function() { 
    var counter = 0; 
    while (counter == courseDayList.length) { 
     var courseName = document.getElementById("cName"); 
     var courseTime = document.getElementById("cTime"); 
     var courseLocation = document.getElementById("cLocation"); 
     courseName.innerHTML = courseDayList[counter].dept + " " + courseDayList[counter].id + "- " + courseDayList[counter].Full_Name + "<br />"; 
     courseTime.innerHTML = courseDayList[counter].Start_Time + "-" + courseDayList[counter].End_Time + "<br />"; 
     courseLocation.innerHTML = courseDayList[counter].Location; 
     counter++; 
    } 
    } 
    courseDayList.printCourses(); 
} 


<div class="panel panel-default"> 
    <div class="panel-heading"> 
     <h4>Today's Schedule</h4> 
     <button class="btn btn-default" type="submit" onclick="showCourseFromDay('Monday')">Monday</button> 
     <button class="btn btn-default" type="submit" onclick="showCourseFromDay('Tuesday')">Tuesday</button> 
     <button class="btn btn-default" type="submit" onclick="showCourseFromDay('Wednesday')">Wednesday</button> 
     <button class="btn btn-default" type="submit" onclick="showCourseFromDay('Thursday')">Thursday</button> 
     <button class="btn btn-default" type="submit" onclick="showCourseFromDay('Friday')">Friday</button> 
    </div> 
    <div class="panel-body"> 
     <div style="border-color:rebeccapurple"></div> 
     <ul class="list-group" ng-repeat="course in schedule"> 
      <li class="list-group-item"> 
       <h4 id="cName"></h4> 
       <p id="cTime"></p> 
       <p id="cLocation"></p> 
      </li> 
     </ul> 
    </div> 
</div> 
+1

什么问题:由于计数器LD从未运行(始终为0)正在对名单(永远不为0)

这里是为您小提琴的大小测试?有错误吗?如果是这样,那么错误信息是什么?代码是否不像您期望的那样行事?如果是这样,会发生什么?你期望会发生什么? – Asaph

+0

对不起,不包含该信息。在理想情况下,代码应该:从JSON对象中找到匹配所选按钮的一天(例如,星期一)的课程,然后;根据开始时间对列表进行排序。由于JSON对象中信息的性质,我将它们转换为其军事等价物用于比较目的。一旦完成后,它应该最终显示具有在声明中指定的信息的已排序课程列表。我一直在尝试使用准备运行onclick函数的准系统HTML页面上的按钮来测试它,但它似乎不起作用。 –

+0

请在您的问题中更新此问题 – Aruna

回答

1
var courses = [ 
    { 
    "dept": "CSC", 
    "id": "3102", 
    "instructor": "Kooima", 
    "Location": "230 Turead", 
    "Start_Time": "1130", 
    "End_Time": "1230", 
    "Attendance": "Tuesday", 
    "Full_Name": "Advanced Data Structures and Algorithm Analysis" 
    }, 
    { 
    "dept": "CSC", 
    "id": "1200", 
    "instructor": "Duncan", 
    "Location": "420 PFT", 
    "Start_Time": "1030", 
    "End_Time": "1130", 
    "Attendance": "Monday", 
    "Full_Name": "Ethics in Computer Science" 
    }, 
    { 
    "dept": "CSC", 
    "id": "4330", 
    "instructor": "Mahmoud", 
    "Location": "150 Coates", 
    "Start_Time": "12:30", 
    "End_Time": "1:30", 
    "Attendance": "Thursday", 
    "Full_Name": "Software Systems Development" 
    }, 
    { 
    "dept": "MATH", 
    "id": "1550", 
    "instructor": "Tom", 
    "Location": "012 Lockett", 
    "Start_Time": "12:30", 
    "End_Time": "1:30", 
    "Attendance": "Wednesday", 
    "Full_Name": "Calculus" 
    }, 
    { 
    "dept": "ENGL", 
    "id": "2000", 
    "instructor": "McKinnon", 
    "Location": "012 Allen Hall", 
    "Start_Time": "9:30", 
    "End_Time": "10:30", 
    "Attendance": "Friday", 
    "Full_Name": "English Composition" 
    }, 
    { 
    "dept": "THTR", 
    "id": "1020", 
    "instructor": "King", 
    "Location": "619 MDMA", 
    "Start_Time": "8:30", 
    "End_Time": "9:30", 
    "Attendance": "Wednesday", 
    "Full_Name": "Introduction to Theatre" 
    } 

]; 

var courseDayList = new []; 

function convertTime(time) { 
    var numericTime = 0; 
    if (time == "8:30") numericTime = 830; 
    if (time == "9:30") numericTime = 930; 
    if (time == "10:30") numericTime = 1030; 
    if (time == "11:30") numericTime = 1130; 
    if (time == "12:30") numericTime = 1230; 
    return numericTime; 
} 

function showCourseFromDay(day) { 
    var i; 
    for (i = 0; i<courses.length; i++) { 
    var course = courses[i]; 
    console.log(course); 
    if (course.Attendance == day) { 
     courseDayList.push(course); 
    } 
    } 
    courseDayList.bubbleSort = function() { 
    var swapped; 
    do { 
     swapped = false; 
     for (var i = 0; i < courseDayList.length - 1; i++) { 
     var time1 = convertTime(courseDayList[i].Start_Time); 
     var time2 = convertTime(courseDayList[i + 1].Start_Time); 
     if (time1 > time2) { 
      var temp = courseDayList[i]; 
      courseDayList[i] = courseDayList[i + 1]; 
      courseDayList[i + 1] = temp; 
      swapped = true; 
     } 
     } 
    } while (swapped); 
    } 
    courseDayList.bubbleSort(); 
    courseDayList.printCourses = function() { 
    var counter = 0; 
    while (counter == courseDayList.length) { 
     var courseName = document.getElementById("cName"); 
     var courseTime = document.getElementById("cTime"); 
     var courseLocation = document.getElementById("cLocation"); 
     courseName.innerHTML = courseDayList[counter].dept + " " + courseDayList[counter].id + "- " + courseDayList[counter].Full_Name + "<br />"; 
     courseTime.innerHTML = courseDayList[counter].Start_Time + "-" + courseDayList[counter].End_Time + "<br />"; 
     courseLocation.innerHTML = courseDayList[counter].Location; 
     counter++; 
    } 
    } 
    courseDayList.printCourses(); 
} 

测试,如果这个工程。一些更正:

  1. 某些功能拼错了。
  2. 语法创建一个函数就是function() {...new function() {...
+0

无法对其进行测试,我似乎无法找到调用该函数进行测试的方法。有什么建议么? –

+0

快速测试:将其粘贴到页面上的脚本标记中,并删除脚本的任何先前版本以防止名称冲突(旧版本覆盖新版本)。此外,请确保您已加载Angular.js(https://angularjs.org/以获取更多信息),因为您在HTML中具有'ng-repeat'。 –

1

有几个问题...

1)convertTime功能被拼错
2)嵌套函数(printCourses和冒泡应该是在全球范围内移出)
3)HTML中的列表结构只能支持单个输出
4)该阵列从未被清除
5)printCourses函数wou

https://jsfiddle.net/jecfkoy7/

<div class="panel panel-default"> 
    <div class="panel-heading"> 
    <h4>Today's Schedule</h4> 
    <button class="btn btn-default" type="submit" onclick="showCourseFromDay('Monday')">Monday</button> 
    <button class="btn btn-default" type="submit" onclick="showCourseFromDay('Tuesday')">Tuesday</button> 
    <button class="btn btn-default" type="submit" onclick="showCourseFromDay('Wednesday')">Wednesday</button> 
    <button class="btn btn-default" type="submit" onclick="showCourseFromDay('Thursday')">Thursday</button> 
    <button class="btn btn-default" type="submit" onclick="showCourseFromDay('Friday')">Friday</button> 
    </div> 
    <div class="panel-body"> 
    <div style="border-color:rebeccapurple"></div> 
    <ul id="list" class="list-group" ng-repeat="course in schedule"> 
     <!--<li class="list-group-item"> 
     <h4 id="cName"></h4> 
     <p id="cTime"></p> 
     <p id="cLocation"></p> 
     </li>--> 
    </ul> 
    </div> 
</div> 

var courses = [{ 
    "dept": "CSC", 
    "id": "3102", 
    "instructor": "Kooima", 
    "Location": "230 Turead", 
    "Start_Time": "1130", 
    "End_Time": "1230", 
    "Attendance": "Tuesday", 
    "Full_Name": "Advanced Data Structures and Algorithm Analysis" 
    }, { 
    "dept": "CSC", 
    "id": "1200", 
    "instructor": "Duncan", 
    "Location": "420 PFT", 
    "Start_Time": "1030", 
    "End_Time": "1130", 
    "Attendance": "Monday", 
    "Full_Name": "Ethics in Computer Science" 
    }, { 
    "dept": "CSC", 
    "id": "4330", 
    "instructor": "Mahmoud", 
    "Location": "150 Coates", 
    "Start_Time": "12:30", 
    "End_Time": "1:30", 
    "Attendance": "Thursday", 
    "Full_Name": "Software Systems Development" 
    }, { 
    "dept": "MATH", 
    "id": "1550", 
    "instructor": "Tom", 
    "Location": "012 Lockett", 
    "Start_Time": "12:30", 
    "End_Time": "1:30", 
    "Attendance": "Wednesday", 
    "Full_Name": "Calculus" 
    }, { 
    "dept": "ENGL", 
    "id": "2000", 
    "instructor": "McKinnon", 
    "Location": "012 Allen Hall", 
    "Start_Time": "9:30", 
    "End_Time": "10:30", 
    "Attendance": "Friday", 
    "Full_Name": "English Composition" 
    }, { 
    "dept": "THTR", 
    "id": "1020", 
    "instructor": "King", 
    "Location": "619 MDMA", 
    "Start_Time": "8:30", 
    "End_Time": "9:30", 
    "Attendance": "Wednesday", 
    "Full_Name": "Introduction to Theatre" 
    } 

]; 

var courseDayList = new Array(); 

convertTime = function(time) { 
    var numericTime = 0; 
    if (time == "8:30") numericTime = 830; 
    if (time == "9:30") numericTime = 930; 
    if (time == "10:30") numericTime = 1030; 
    if (time == "11:30") numericTime = 1130; 
    if (time == "12:30") numericTime = 1230; 
    return numericTime; 
} 

bubbleSort = function() { 
    var swapped; 
    do { 
     swapped = false; 
     for (var i = 0; i < courseDayList.length - 1; i++) { 
     var time1 = convertTime(courseDayList[i].Start_Time); 
     var time2 = convertTime(courseDayList[i + 1].Start_Time); 
     if (time1 > time2) { 
      var temp = courseDayList[i]; 
      courseDayList[i] = courseDayList[i + 1]; 
      courseDayList[i + 1] = temp; 
      swapped = true; 
     } 
     } 
    } while (swapped); 
    } 

    printCourses = function() { 
    var counter = 0; 
    while (counter <= courseDayList.length - 1) { 
     /*var courseName = document.getElementById("cName"); 
     var courseTime = document.getElementById("cTime"); 
     var courseLocation = document.getElementById("cLocation");*/ 
     var courseName = courseDayList[counter].dept + " " + courseDayList[counter].id + "- " + courseDayList[counter].Full_Name; 
     var courseTime = courseDayList[counter].Start_Time + "-" + courseDayList[counter].End_Time; 
     var courseLocation = courseDayList[counter].Location; 

     var list = document.getElementById('list'); 
     var entry = document.createElement('li'); 
     entry.appendChild(document.createTextNode(courseName)); 
     entry.appendChild(document.createTextNode(courseTime)); 
     entry.appendChild(document.createTextNode(courseLocation)); 
     list.appendChild(entry);  

     counter++; 
    } 

    } 

showCourseFromDay = function(day) { 

    //Clear existing records 
    var list = document.getElementById('list'); 
    while (list.firstChild) list.removeChild(list.firstChild); 

    var i; 
    for (i = 0; i < courses.length; i++) { 
    var course = courses[i]; 
    console.log(course); 
    if (course.Attendance == day) { 
     courseDayList.push(course); 
    } 
    } 

    bubbleSort(); 
    printCourses(); 
    courseDayList = new Array(); 
} 
+0

衷心感谢您所做的一切 –

+0

很高兴为您提供帮助,如果您的问题已解决,请将其标记为答案,谢谢。 – RizJa