学习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>
前提:页面上有成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>
用firebug来调试很容易找到错误。自己去做吧。
<!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>
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=="*"这个表达式,也就不会报错了