1

谁能发现一个明显的错误?为什么这个 Javascript 生成的表(showResults函数)没有出现在我的 html 中?当我有很多文字值要引用时,总是会发生这种情况......我也会感谢对我的格式(空白)的任何其他评论!

   <script type="text/javascript"> 
    //calculates sum of all values within an array
   function totalVotes(votes){  /
        var total=0;
        for (i=0;i<votes.length;i++){
        total = votes[i] + total;
        }
        return total;
    }
    //calculates a percentage, rounded to nearest integer
    function calcPercent(item, sum){    
        return Math.round((item/sum)*100);
    }
    //tests value of partyType parameter        
   function createBar(partyType, percent){   
        switch (partyType){
            case D:  barText="<td class='dem'></td>";
            break;
            case R:  barText="<td class='rep'></td>";
            break;
            case I:  barText="<td class='ind'></td>";
            break;
            case G:  barText="<td class='green'></td>";
            break;
            case L:  barText="<td class='lib'></td>";
            break;
        }
        for(i=1;i<=percent;i++){    
            document.write(barText);
        }
    }
    function showResults(race,name,party,votes){
        var totalV=function totalVotes(votes);

        document.write("<h2>" +race+ "</h2>");
        document.write("<table cellspacing='0'>");
        document.write("<tr>");
        document.write("<th>Candidate</th>");
        document.write("<th class='num'> Votes</th>");
        document.write("<th class='num'>%</th>");
        document.write("</tr>");

        for (r=0;r<name.length;r++){
            document.write("<tr>");
            document.write("<td>"+name[i]+ '(' +party[r]+ ")" +"</td>");
            document.write("<td class='num'>" +votes[r]+ "</td>");

            var percent=function calPercent(votes[r],totalV)
            document.write("<td class='num'>(" +percent[r]+ "%)</td>");
            createBar(party[r], percent);
            document.write("</tr>");
        }   
        document.write("</table>");
    }

4

3 回答 3

3

我认为您需要在与字符串进行比较时给出引号,Hence D is not same as "D".

  switch (partyType){
            case "D":  barText="<td class='dem'></td>";
            break;
            case "R":  barText="<td class='rep'></td>";
            .......

也正如其他人所建议的那样,在调用它时删除函数关键字。

var totalV = function totalVotes(votes);

应该

  var totalV = totalVotes(votes);
于 2013-06-19T11:51:00.003 回答
1

1) 在您的案例陈述中使用引号:case "D", case "R", ...

2)使用innerHTML方法而不是document.write。仅在连接字符串中使用一次,而不是在for循环内。

3)var totalV = function totalVotes(votes);会引发一个错误:也许你可能想写var totalV = totalVotes(votes);

4)barText未在任何地方定义(先用 声明var


如果您也对通用建议感兴趣,则可以通过对象查找来避免整个开关

function createBar(partyType, percent){   

    var cells     = "",
        cellclass = { 
          "D": "dem", "R": "rem", "I": "ind", "G": "green", "L": "lib" 
        }[partyType];


    for(var i = 1; i <= percent.length; i++){    
        cells += "<td class='" +  cellclass + "'></td>"
    }

    <yourtablerow>.innerHTML = cells; // <yourtablerow> is a reference to a table row.
}
于 2013-06-19T11:52:30.257 回答
1

你的代码有很多问题:

  1. totalVotes函数的左大括号后的随机斜杠

  2. 在没有 for 循环的情况下声明变量var(这不会破坏您的代码,但这样做不是一个好主意)

  3. 正如其他人所说,switch语句的使用不正确(非数字字符需要用引号引起来)

  4. 正如 Fabrizio Calderan 所说,barText设置不正确。它起作用,但这是非常糟糕的做法。在切换之前先声明它。

  5. 根据您传递给它的内容,for-loop increateBar将不起作用。您将数组作为percent内部 for 循环中的值传递,showResults然后通过将其与数字进行比较来将其视为数字。你想percent.length在 for 循环中代替。

  6. 访问函数的方法不正确。var totalV=function totalVotes(votes);无效,将无法工作。或者使用var totalV=totalVotes(votes);或者如果您不想使用它,var totalV=totalVotes.call(null, votes);(尽管您不需要.call在代码中使用该属性)

  7. 函数中的 for 循环内的另一个错误showResultsvar percent=function calPercent(votes[r],totalV)这两个问题都是我的第 6 点,即错误地访问函数以及由于拼写错误而实际上不存在该函数。很确定你的意思var percent=calcPercent(votes[r],totalV)

  8. 我不喜欢这种document.write方法,并且很长时间没有使用它。由于它的工作方式/写入位置,我个人不惜一切代价避免它。同样正如 Fabrizio 所建议的,innerHTML这是一个更好的选择。

总的来说,代码很干净并且大部分都可以工作,但我觉得你甚至没有尝试在启用调试器的情况下运行代码。Firefox 和 Chrome 都有一个不错的本机调试器,并且会发现这些错误。

尽管如此,我已经用这些问题修复了你的代码。仍然可以进行一些其他更改以使代码更好/更小/更简单,但我认为现在就可以了。

<script type="text/javascript"> 
    //calculates sum of all values within an array
    function totalVotes(votes)
    {
        var total=0;
        for (var i=0; i < votes.length; i++){
            total = votes[i] + total;
        }
        return total;
    }
    //calculates a percentage, rounded to nearest integer
    function calcPercent(item, sum)
    {
        return Math.round((item/sum)*100);
    }
    //tests value of partyType parameter        
    function createBar(partyType, percent)
    {
        var barText = null;
        switch (partyType)
        {
            case 'D':  barText="<td class='dem'></td>";
            break;
            case 'R':  barText="<td class='rep'></td>";
            break;
            case 'I':  barText="<td class='ind'></td>";
            break;
            case 'G':  barText="<td class='green'></td>";
            break;
            case 'L':  barText="<td class='lib'></td>";
            break;
        }
        var result = "";
        for(var i=1;i<percent.length;i++)
        {
            result += barText;
        }
        return result;
    }
    function showResults(race,name,party,votes)
    {
        var totalV=totalVotes(votes);
        var result = "";

        result += "<h2>" +race+ "</h2>";
        result += "<table cellspacing='0'>";
        result += "<tr>";
        result += "<th>Candidate</th>";
        result += "<th class='num'> Votes</th>";
        result += "<th class='num'>%</th>";
        result += "</tr>";

        var percent = 0;
        for (var r=0; r < name.length; r++){
            result += "<tr>";
            result += "<td>"+name[i]+ '(' +party[r]+ ")" +"</td>";
            result += "<td class='num'>" +votes[r]+ "</td>";

            percent = calcPercent(votes[r],totalV)
            result += "<td class='num'>(" +percent[r]+ "%)</td>";
            result += createBar(party[r], percent);
            result += "</tr>";
        }
        result += "</table>";

        document.body.innerHTML = result; // or document.write(result) if you prefer
    }
</script>
于 2013-06-19T12:22:28.513 回答