学习JS写的第一个长代码 写的烂 让您受累了。
前提:页面上有成X*X排列的按钮,value=*代表空,点击*周边value不是空的按钮,把被点击按钮换成*,*变成被点击按钮之前的VALUE运行的时候只有个别按钮生效,FF经常提示在最后的IF里document.getElementById(idDown)为空
但是我查的头都晕了,实在找不出来错误,才发上来的,谢谢帮忙<script type="text/javascript">
function MoveNumber(a){
//无论方格是多大只要是规则正方形,用数组形式操作ID,ID用数组形式和排列方式相对应。判断上下左右按钮是否为控,为空既可移动。取上下左右的按钮value
var ButtonId=a.id;
var ButtonValue=a.value;
//被点击按钮的ID和VALUE,参数用fn(this)传进来
if (ButtonValue!="*"){
var IdArray=ButtonId.split(""); //把取到的ID用字符串数组分解。
var idUp,idUp1,idDown,idDown1,idLeft,idLeft1,idRight,idRight1;
if (IdArray[1]==0){ //如果是在方格最左边,不对不存在的BUTTON.ID取值
idLeft=a.id;
idRight1=(IdArray[1]*1+1);
idRight=(IdArray[0].toString()+idRight1);
if (IdArray[1]==0){
idUp=a.id;
idDown1=(IdArray[0]*1+1);
idDown=(idDown1.toString()+IdArray[1]);
}else if(IdArray[1]==2){
idDown=a.id;
idUp1=(IdArray[0]*1-1);
idUp=(idUp1.toString()+IdArray[1]);
}else{
idUp1=(IdArray[0]*1-1);
idUp=(idUp1.toString()+IdArray[1]);
idDown1=(IdArray[0]*1+1);
idDown=(idDown1.toString()+IdArray[1]);
}
}
if (IdArray[0]==2){ //如果是在方格最下端,不对不存在的BUTTON.ID取值
idDown=a.id;
idUp1=(IdArray[0]*1-1);
idUp=(idUp1.toString()+IdArray[1]);
if (IdArray[1]==2){
idRight=a.id;
idLeft1=(IdArray[1]*1-1);
idLeft=(IdArray[0].toString()+idLeft1);
}else if(IdArray[1]==0){
idLeft=a.id;
idRight1=(IdArray[1]*1+1);
idRight=(IdArray[0].toString()+idRight1);
}else{
idLeft1=(IdArray[1]*1-1);
idLeft=(IdArray[0].toString()+idLeft1);
idRight1=(IdArray[1]*1+1);
idRight=(IdArray[0].toString()+idRight1);
}
}
if (IdArray[1]==2){ //如果是在方格最右端,不对不存在的BUTTON.ID取值
idRight=a.id;
idLeft1=(IdArray[1]*1-1);
idLeft=(IdArray[0].toString()+idLeft1);
if (IdArray[0]==0){
idUp=a.id;
idDown1=(IdArray[0]*1+1)
idDown=(idDown1.toString()+IdArray[1]);
}else if (IdArray[0]==2){
idDown=a.id;
idUp1=(IdArray[0]*1-1)
idUp=(idUp1.toString()+IdArray[1]);
}else{
idUp1=(IdArray[0]*1-1)
idUp=(idUp1.toString()+IdArray[1]);
idDown1=(IdArray[0]*1+1)
idDown=(idDown1.toString()+IdArray[1]);
}

}
if (IdArray[0]==0){ //如果是在方格最上端,不对不存在的BUTTON.ID取值
idUp=a.id;
idDown1=(IdArray[0]*1+1)
idDown=(idDown1.toString()+IdArray[1]);
if (IdArray[1]==0){
idLeft=a.id;
idRight1=(IdArray[1]*1+1)
idRight=(IdArray[0].toString()+idRight1);
}else if (IdArray[1]==2){
idRight=a.id;
idLeft1=(IdArray[1]*1-1)
idLeft=(IdArray[0].toString()+idLeft1);
}else{
idLeft1=(IdArray[1]*1-1)
idLeft=(IdArray[0].toString()+idLeft1);
idRight1=(IdArray[1]*1+1)
idRight=(IdArray[0].toString()+idRight1);
}
}else{ //如果上下左右都有按钮,就ID取值
idUp1=(IdArray[0]*1-1)
idUp=(idUp1.toString()+IdArray[1]);
idDown1=(IdArray[0]*1+1)
idDown=(idDown1.toString()+IdArray[1]);
idLeft1=(IdArray[1]*1-1)
idLeft=(IdArray[0].toString()+idLeft1);
idRight1=(IdArray[1]*1+1)
idRight=(IdArray[0].toString()+idRight1);
} if (document.getElementById(idUp).value=="*"){
document.getElementById(idUp).value=ButtonValue;
a.value="*";
}
else if(document.getElementById(idDown).value=="*"){
document.getElementById(idDown).value=ButtonValue;
a.value="*";
}
else if(document.getElementById(idLeft).value=="*"){
document.getElementById(idLeft).value=ButtonValue;
a.value="*";
}
else if(document.getElementById(idRight).value=="*"){
document.getElementById(idRight).valu=ButtonValue;
a.value="*";
}

//相应的按钮换上点击按钮的VALUE,被点击按钮换上*
}

</script> 

解决方案 »

  1.   

    太长了,看着头晕,建议发帖代码尽量短,高手看了这长一段,不想去看了。
    用firebug来调试很容易找到错误。自己去做吧。
      

  2.   


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
     <HEAD>
      <TITLE> New Document </TITLE>
      <META NAME="Generator" CONTENT="EditPlus">
      <META NAME="Author" CONTENT="">
      <META NAME="Keywords" CONTENT="">
      <META NAME="Description" CONTENT="">
      
     </HEAD>
     <BODY>
      <input type="button" value="f" onclick="MoveNumber(this)" id="1_1"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="1_2"/>
      <input type="button" value="t" onclick="MoveNumber(this)" id="1_3"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="1_4"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="1_5"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="1_6"/><br>
      <input type="button" value="h" onclick="MoveNumber(this)" id="2_1"/>
      <input type="button" value="k" onclick="MoveNumber(this)" id="2_2"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="2_3"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="2_4"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="2_5"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="2_6"/><br>
      <input type="button" value="a" onclick="MoveNumber(this)" id="3_1"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="3_2"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="3_3"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="3_4"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="3_5"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="3_6"/><br>
      <input type="button" value="*" onclick="MoveNumber(this)" id="4_1"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="4_2"/>
      <input type="button" value="g" onclick="MoveNumber(this)" id="4_3"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="4_4"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="4_5"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="4_6"/><br>
      <input type="button" value="*" onclick="MoveNumber(this)" id="5_1"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="5_2"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="5_3"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="5_4"/>
      <input type="button" value="r" onclick="MoveNumber(this)" id="5_5"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="5_6"/><br>
      <input type="button" value="*" onclick="MoveNumber(this)" id="6_1"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="6_2"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="6_3"/>
      <input type="button" value="t" onclick="MoveNumber(this)" id="6_4"/>
      <input type="button" value="*" onclick="MoveNumber(this)" id="6_5"/>
      <input type="button" value="j" onclick="MoveNumber(this)" id="6_6"/><br>
      <script type="text/javascript">
    function MoveNumber(a){
    var tid=a.id;
    var tv=a.value;
    var arrId=tid.split("_");
    var bup,bdown,bleft,bright; bup=(arrId[0]-1)+"_"+arrId[1];
    bdown=(arrId[0]*1+1)+"_"+arrId[1];
    bleft=arrId[0]+"_"+(arrId[1]-1);
    bright=arrId[0]+"_"+(arrId[1]*1+1); var obup=document.getElementById(bup);
    var obdown=document.getElementById(bdown);
    var obleft=document.getElementById(bleft);
    var obright=document.getElementById(bright);

    if(obup&&obup.value=="*"){
    obup.value=tv;
    } if(obdown&&obdown.value=="*"){
    obdown.value=tv;
    } if(obleft&&obleft.value=="*"){
    obleft.value=tv;
    } if(obright&&obright.value=="*"){
    obright.value=tv;
    }
    a.value="*";
    }  
     </script> 
     </BODY>
    </HTML>
      

  3.   

    太厉害了。。写的这么简单。但是请问下怎么解决边框上的会出现负数ID的情况?比如第一行第一列的1_1,取左边的ID位1_0 上面的ID为0_1这两个按钮都不存在,不是会出现错误么?怎么解决的这个问题还有if(obup&&obup.value=="*")条件中obup这个表达式什么意思?
      

  4.   

    bup=(arrId[0]-1)+"_"+arrId[1];//获得上方按钮的 id
    var obup=document.getElementById(bup);//根据id得到上方按钮对象,如果不存在会返回null值
    if(obup&&obup.value=="*"){//判断按钮按钮是否存在,如果存在且其值为“*”则执行大括号内代码
         obup.value=tv;
    }这里的“&&”逻辑运算符的意思就是and的意思,当符号两边的表达式都为true时整个括号才为true,如果第一个表达式为flase的话则不会执行第二个表达式!1、如果按钮不存在的话那么obup的值是null,
    2、null转化成布尔值就是false,
    3、第一个表达式是false的话那么就不会执行后面obup.value=="*"这个表达式,也就不会报错了