以下代码存在一些问题。原始代码是由一位名叫Adam Khoury的绅士写的，我试图找到他，但我无法这样做。该代码创建了一个视觉记忆游戏，其中包含字母“A＆＃39;通过＆＃39; L＆＃39;。我想修改它以应用于分数。所以＆＃39; 1/4＆＃39;和25％会匹配。或者＆＃33; 33％＆＃39;和＆＃0.3; 0.33＆＃39;等
我在我的头上。我在javascript中非常生疏，虽然我了解大部分正在发生的事情，但我对如何使其发挥作用感到很遗憾。
我的解决方案如下。我添加了一个新数组＆＃34; memory_array2＆＃34;具有成对的分数/小数/百分比的对应值。我将memory_array和memory_array2解析为memoryFlipTile函数。这个想法是为了显示＆＃34;第二个数组，但使用第一个数组中的值来匹配相应的对。
我尝试更换＆＃34; val＆＃34;在第55行中使用val2，虽然它确实用array2替换了板中的值，但它a）并排创建它们，并且b）即使相应的tile被翻转，它们也不会保持翻转。
我也不太清楚memory_values和memory_values.length的功能是什么。
我完全理解在翻转两张卡后代码如何清除数组，检查电路板是否被清除并创建新电路板，如果它们不匹配则翻转卡片。
非常感谢您的帮助！
<!DOCTYPE html>
<html>
<head>
<style>
div#memory_board{
background:#CCC;
border:#999 1px solid;
width:795px;
height:340px;
padding:10px;
margin:0px auto;
}
div#memory_board > div{
background: url(tile_bg.jpg) no-repeat;
border:#000 1px solid;
width:90px;
height:43px;
float:left;
margin:10px;
padding:10px;
font-size:36px;
cursor:pointer;
text-align:center;
}
</style>
<script>
// Scripted By Adam Khoury in connection with the following video tutorial:
// http://www.youtube.com/watch?v=c_ohDPWmsM0
var memory_array = ['A','A','B','B','C','C','D','D','E','E','F','F','G','G','H','H','I','I','J','J','K','K','L','L'];
var memory_array2 = ['13%','0.13','25%','1/4','1/3','0.33','0.7','70%','.5','1/2','1/8','12.5%','2/5','40%','3/4','75%','3/5','0.60','20%','0.20','1/10','10%','30%','0.30'];
var memory_values = [];
var memory_tile_ids = [];
var tiles_flipped = 0;
Array.prototype.memory_tile_shuffle = function(){
var i = this.length, j, temp;
while(--i > 0){
j = Math.floor(Math.random() * (i+1));
temp = this[j];
this[j] = this[i];
this[i] = temp;
}
}
function newBoard(){
tiles_flipped = 0;
var output = '';
memory_array.memory_tile_shuffle();
for(var i = 0; i < memory_array.length; i++){
output += '<div id="tile_'+i+'" onclick="memoryFlipTile(this,\''+memory_array[i]+'\',\''+memory_array2[i]+'\')"></div>';
}
document.getElementById('memory_board').innerHTML = output;
}
function memoryFlipTile(tile,val,val2){
if(tile.innerHTML == "" && memory_values.length < 2){
tile.style.background = '#FFF';
tile.innerHTML = val;
if(memory_values.length == 0){
memory_values.push(val);
memory_tile_ids.push(tile.id);
} else if(memory_values.length == 1){
memory_values.push(val);
memory_tile_ids.push(tile.id);
if(memory_values[0] == memory_values[1]){
tiles_flipped += 2;
// Clear both arrays
memory_values = [];
memory_tile_ids = [];
// Check to see if the whole board is cleared
if(tiles_flipped == memory_array.length){
alert("Board cleared... generating new board");
document.getElementById('memory_board').innerHTML = "";
newBoard();
}
} else {
function flip2Back(){
// Flip the 2 tiles back over
var tile_1 = document.getElementById(memory_tile_ids[0]);
var tile_2 = document.getElementById(memory_tile_ids[1]);
tile_1.style.background = 'url(tile_bg.jpg) no-repeat';
tile_1.innerHTML = "";
tile_2.style.background = 'url(tile_bg.jpg) no-repeat';
tile_2.innerHTML = "";
// Clear both arrays
memory_values = [];
memory_tile_ids = [];
}
setTimeout(flip2Back, 700);
}
}
}
}
</script>
</head>
<body>
<div id="memory_board"></div>
<script>newBoard();</script>
<p id="test"></p>
</body>
</html>
答案 0 :(得分：0)
好的。游戏目前正在做的是比较字符串值，例如'E'=='E'，但是你要处理的是百分比/分数/小数。
您需要找到一种方法将所有这些值转换为一种类型，以便它们可以相互比较。现在这种偏好是小数。
现在，我要做的很脏，你应该找到一个更好的方法。我将使用eval [警告可能是有害的]来隐藏字符串＆＃39; 3/4＆＃39;到0.75。
我这样做是因为我很懒，但你可以将字符串拆分为/并将两部分相互分开。
eval('3/4') == '0.75' //true
eval('3/4') === '0.75' //false
这解决了我们的分数问题。现在达到百分比。此代码将转换为＆＃39; 50％＆＃39;到0.5：
parseFloat(('50%')/100.0; //0.5
我应该只做这个百分比，因此我会在做之前检查每个数字是否是百分比。这给我们留下了这段代码：
function endsWith(str, suffix) { return str.slice(-suffix.length) === suffix }
if(endsWith(memory_values[0], '%')) {
memory_values[0] = parseFloat(memory_values[0])/100.0;
}
if(endsWith(memory_values[1], '%')) {
memory_values[1] = parseFloat(memory_values[1])/100.0;
}
现在，我们的memory_values[0]和memory_values[1]都是分数形式或小数形式。
让我们比较它们（同时eval分数）
if(eval(memory_values[0]) == eval(memory_values[1])){
...
}
以下是生成的有效代码：http://pastebin.com/cwSjrsBD 在这里它是一个网站：https://dl.dropboxusercontent.com/u/182097009/working.html
错误提示：eval('1/3') != '0.33'
你需要围绕你的数字。
答案 1 :(得分：0)
我认为应该改变一些逻辑。
memory_array和memory_array2视为两组不同的内存。isCombination()中完成的。title属性。newBoard期望在没有任何参数的情况下调用稍后使用的数组。
// Scripted By Adam Khoury in connection with the following video tutorial:
// http://www.youtube.com/watch?v=c_ohDPWmsM0
var memory_array = ['A', 'A', 'B', 'B', 'C', 'C', 'D', 'D', 'E', 'E', 'F', 'F', 'G', 'G', 'H', 'H', 'I', 'I', 'J', 'J', 'K', 'K', 'L', 'L'],
memory_array2 = ['13%', '0.13', '25%', '1/4', '1/3', '0.33', '0.7', '70%', '.5', '1/2', '1/8', '12.5%', '2/5', '40%', '3/4', '75%', '3/5', '0.60', '20%', '0.20', '1/10', '10%', '30%', '0.30'],
memory_values = [],
memory_tile_ids = [],
tiles_flipped = 0,
actualMemory;
Array.prototype.getShuffledIndices = function () {
var indices = Array.apply(Array, { length: this.length }).map(function (_, i) { return i; }),
i = this.length, j, temp;
while (--i) {
j = Math.random() * i | 0;
temp = indices[j];
indices[j] = indices[i];
indices[i] = temp;
}
return indices;
}
function newBoard(memory) {
if (memory) {
actualMemory = memory;
}
tiles_flipped = 0;
document.getElementById('memory_board').innerHTML = actualMemory.getShuffledIndices().map(function (a) {
return '<div title="' + a + '" id="tile_' + a + '" onclick="memoryFlipTile(this, ' + a + ')"></div>';
}).join('');
}
function memoryFlipTile(tile, val) {
function isCombination(a, b) {
if (a + 1 === b || b + 1 === a) {
return (a + b - 1) % 4 === 0;
}
}
function flip2Back() {
// Flip the 2 tiles back over
var tile_1 = document.getElementById(memory_tile_ids[0]);
var tile_2 = document.getElementById(memory_tile_ids[1]);
tile_1.style.background = 'url(tile_bg.jpg) no-repeat';
tile_1.innerHTML = "";
tile_2.style.background = 'url(tile_bg.jpg) no-repeat';
tile_2.innerHTML = "";
// Clear both arrays
memory_values = [];
memory_tile_ids = [];
}
if (tile.innerHTML == "" && memory_values.length < 2) {
tile.style.background = '#FFF';
tile.innerHTML = actualMemory[val];
if (memory_values.length == 0) {
memory_values.push(val);
memory_tile_ids.push(tile.id);
} else if (memory_values.length == 1) {
memory_values.push(val);
memory_tile_ids.push(tile.id);
if (isCombination(memory_values[0], memory_values[1])) {
tiles_flipped += 2;
// Clear both arrays
memory_values = [];
memory_tile_ids = [];
// Check to see if the whole board is cleared
if (tiles_flipped == memory_array.length) {
alert("Board cleared... generating new board");
document.getElementById('memory_board').innerHTML = "";
newBoard();
}
} else {
setTimeout(flip2Back, 700);
}
}
}
}
// call with the wanted memory, in this case it is possible to select
// between memory_array and memory_array2
newBoard(memory_array2);div#memory_board {
background: #CCC;
border: #999 1px solid;
width: 795px;
height: 340px;
padding: 10px;
margin: 0px auto;
}
div#memory_board > div {
background: url(tile_bg.jpg) no-repeat;
border: #000 1px solid;
width: 90px;
height: 43px;
float: left;
margin: 10px;
padding: 10px;
font-size: 36px;
cursor: pointer;
text-align: center;
}<div id="memory_board"></div>