首页 新闻 会员 周边

js重新加载页面出错

0
悬赏园豆：20 [已解决问题] 解决于 2015-05-05 18:46

直接上代码：

html部分：

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <link rel="stylesheet" href="css_01.css">
    <title>Make your own Bingo Card</title>
</head>
<body>
<h1>create your own bingo card!</h1>
<table>
    <tr>
        <th>B</th>
        <th>I</th>
        <th>N</th>
        <th>G</th>
        <th>O</th>
    </tr>
    <tr>
        <td id="square0">&nbsp;</td>
        <td id="square5">&nbsp;</td>
        <td id="square10">&nbsp;</td>
        <td id="square14">&nbsp;</td>
        <td id="square19">&nbsp;</td>
    </tr>
    <tr>
        <td id="square1">&nbsp;</td>
        <td id="square6">&nbsp;</td>
        <td id="square11">&nbsp;</td>
        <td id="square15">&nbsp;</td>
        <td id="square20">&nbsp;</td>
    </tr>
    <tr>
        <td id="square2">&nbsp;</td>
        <td id="square7">&nbsp;</td>
        <td id="free">&nbsp;</td>
        <td id="square16">&nbsp;</td>
        <td id="square21">&nbsp;</td>
    </tr>
    <tr>
        <td id="square3">&nbsp;</td>
        <td id="square8">&nbsp;</td>
        <td id="square12">&nbsp;</td>
        <td id="square17">&nbsp;</td>
        <td id="square22">&nbsp;</td>
    </tr>
    <tr>
        <td id="square4">&nbsp;</td>
        <td id="square9">&nbsp;</td>
        <td id="square13">&nbsp;</td>
        <td id="square18">&nbsp;</td>
        <td id="square23">&nbsp;</td>
    </tr>
</table>
<p><a href="Bingo.html" id="reload">Click here</a>to create a new card </p>
</body>
</html>
<script src="js_01.js"></script>

css部分

body{
    background: white;
    color: black;
    font-size: 20px;
    font-family:verdana, helvetica, arial, sans-serif;
    font-weight: 900;
}

h1,th{
    font-family:verdana, helvetica, arial, sans-serif;
}

h1{
    font-size: 28px;
}

table{
    border-collapse: collapse;
}

th,td{
    padding: 10px;
    border: 2px #666 solid;
    text-align: center;
    width: 20px;
}

#free, .pickedBG{
    background-color: #f66;
}

 

js部分：

/**
 * Created by rui on 2015/5/5.
 */

window.onload=initAll;
var usedNums=new Array(76);

function initAll(){
    if(document.getElementById) {
        //重新加载这里有问题
        document.getElementById("reload").onclick=anotherCard;
        newCard();
    }else{
        alert("sorry,浏览器不支持！")
    }
}

function newCard(){
    for(var i=0;i<24;i++) {
        setSquare(i);
    }
}

function setSquare(thisSquare){
    var currentSquare="square"+thisSquare;
    var colPlace=new Array(0,0,0,0,0,1,1,1,1,1,2,2,2,2,3,3,3,3,3,4,4,4,4,4);
    var colBasic=colPlace[thisSquare]*15;
    var newNum;
    do{
        newNum=colBasic+getNum()+1;
    }while(usedNums[newNum]==false);

    //将数组的内容改为存储当前值
    usedNums[newNum]=true;
    document.getElementById(currentSquare).innerHTML=newNum;
}

function getNum(){
    return Math.floor(Math.random()*15);
}

function anotherCard(){
    for(var i=1;i<usedNums.length;i++){
        usedNums[i]=false;
    }
    newCard();
    return false;
}

本人刚开始学习javascript，这个是书上的学习项目，其他部分运行就是ok的，但是点击onload就是出现问题，我用google chrome浏览器当前页面鼠标指针会变成手掌然后就不能操作了，我想知道这是为什么？控制台也没有任何消息,个人猜测可能有浏览器的问题？我觉得代码问题不大啊。。

ruirui610的主页 ruirui610 | 初学一级 | 园豆：16
提问于：2015-05-05 15:39
< >
分享
最佳答案
0

html 和css 部分打不开呢。。。。

收获园豆：20
chengdu.jack.li | 菜鸟二级 |园豆：274 | 2015-05-05 16:11

 不好意思，修改了，全部不折叠可能有点乱

ruirui610 | 园豆：16 (初学一级) | 2015-05-05 16:20

@ruirui610: 用这个循环就死编译器。。。。

do{ newNum=colBasic+getNum()+1; }while(usedNums[newNum]==false);

chengdu.jack.li | 园豆：274 (菜鸟二级) | 2015-05-05 16:50

你不需要首次调用anotherCard() 这个方法去把数组初始化为false吗？

不然数组的值都是undefined.  

那么循环，不是死循环了吗？

while(usedNums[newNum]==false)

 

我觉得你这个循环是有问题的，麻烦你单独验证这个循环先

chengdu.jack.li | 园豆：274 (菜鸟二级) | 2015-05-05 16:51

@chengdu.jack.li: 好吧，我弄错了，不好意思啊，应该是while(usedNums[newNum])这样的

ruirui610 | 园豆：16 (初学一级) | 2015-05-05 18:45

@chengdu.jack.li: 并不需要初始化，默认就是false

ruirui610 | 园豆：16 (初学一级) | 2015-05-05 18:46
其他回答(1)
0

好吧，那么我建议你还是看视频，然后开始看书，试过了，再去找根

_Vegetables | 园豆：586 (小虾三级) | 2015-05-05 16:09
清除回答草稿
   您需要登录以后才能回答，未注册用户请先注册。