我有以下(有点长)html代码:
<!DOCTYPE html>
<html>
<head>
<script type = "text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
<script>
$(document).ready(function(){
var embargo_top = 0;
var embargo_left = 0;
var allowed = true;
var to_delete = "";
function initialize_board(){
var random_array = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15];
var positions = ["one", "two", "three", "four", "five", "six", "seven", "eight", "nine", "ten", "eleven", "twelve", "thirteen", "fourteen", "fifteen", "sixteen"];
while (random_array.length > 0){
var rand = random_array[Math.floor(Math.random() * random_array.length)];
var pos = positions[Math.floor(Math.random() * positions.length)];
document.getElementById(pos).innerHTML = rand;
var index = random_array.indexOf(rand);
random_array.splice(index, 1);
var pos_index = positions.indexOf(pos);
positions.splice(pos_index, 1);
}
var div = "#" + positions[0];
var coords = $(div).position();
embargo_top = coords.top;
embargo_left = coords.left;
to_delete = positions[0];
$(document.getElementById(positions[0])).hide();
}
initialize_board();
function determine_solvability(){
var num_inversions = 0;
var array_inc = [];
var possibilities = ["one", "two", "three", "four"];
var to_add = 0;
for(i = 0; i<possibilities.length; i++){
var tmp = document.getElementById(possibilities[i]);
var id = tmp.id;
alert(id);
var to_append = tmp.innerHTML;
array_inc.push(to_append);
console.log(array_inc);
num_inversions = check_tile(id, array_inc, num_inversions);
}
console.log(num_inversions);
}
determine_solvability();
function check_tile(num, array_inc, num_inversions){
console.log(array_inc);
var div = document.getElementById(num);
var val = div.innerHTML;
if (val == 1){
return num_inversions;
}
else{
var count = 1;
for(i = 0; i < array_inc.length; i++){
var arraryTmp = parseInt(array_inc[i]);
var intVal = parseInt(val);
if (arraryTmp < intVal){
count += 1;
}
}
num_inversions += (val - count);
console.log(num_inversions);
return num_inversions;
}
};
});
</script>
</head>
<body>
<table style = "width: 100%">
<tr>
<td><div class = "tile" id = "one"></div></td>
<td><div class = "tile" id = "two"></div></td>
<td><div class = "tile" id = "three"></div></td>
<td><div class = "tile" id = "four"></div></td>
</tr>
<tr>
<td><div class = "tile" id = "five"></div></td>
<td><div class = "tile" id = "six"></div></td>
<td><div class = "tile" id = "seven"></div></td>
<td><div class = "tile" id = "eight"></div></td>
</tr>
<tr>
<td><div class = "tile" id = "nine"></div></td>
<td><div class = "tile" id = "ten"></div></td>
<td><div class = "tile" id = "eleven"></div></td>
<td><div class = "tile" id = "twelve"></div></td>
</tr>
<tr>
<td><div class = "tile" id = "thirteen"></div></td>
<td><div class = "tile" id = "fourteen"></div></td>
<td><div class = "tile" id = "fifteen"></div></td>
<td><div class = "tile" id = "sixteen"></div></td>
</tr>
</table>
</body>
</html>
在第二个脚本标记中的determine_solvability函数中,出现了一个有趣的现象。当我注释掉这一行时,
//num_inversions = check_tile(id, array_inc, num_inversions);
函数第一部分中的for循环按照我的期望在div id数组上执行。但是,当我取消前一行
的注释时 num_inversions = check_tile(id, array_inc, num_inversions);
for循环完全跳过整个第二个索引,不会出错。这怎么可能呢?
注意:在您对此进行注释之前,脚本中的其他代码在4x4表上随机生成数字1-15。在某些情况下,顶部行(我将在determine_solvability()函数的for循环中遍历它)中只有三个tile/元素。我的问题是,当最上面一行有四个元素/贴图时,为什么迭代时总是跳过该行的第二个元素?(通过对array_inc执行console.log函数确认)
你的I变量是全局的,会被破坏
更改所有
for(i = 0 ...
for(var i = 0 ...