javascript - Javascript图像不会显示

标签 javascript

我对javascript几乎一无所知,但是我能够阅读代码并了解正在发生的事情(我认为)。我只需要在学校的项目中插入游戏,然后操纵格式等即可匹配我的项目。这不会公开或其他任何形式。因此,我插入了这个免费游戏,但它不允许我更改图片。我不明白为什么。我尝试使javascript第2行的var x等于var x = new image(..),并尝试将图像直接放在199行的代码中。第一次尝试破坏了代码,第二次尝试没有成功做任何事情。我在这里想念什么?感谢您的智慧。

tictac.js

<!-- Begin
var x = "../images/americanPeregrineFalconsm.jpg";  //**Line 2**
// Location of where you uploaded your site's x.jpg image

var o = "../images/carolinaWrensm.jpg";
// Location of where you uploaded your site's o.jpg image

var blank = "../images/highlight-bg.png";
// Location of where you uploaded your site's blank.jpg image
.
.
.
.

function yourChoice(chName) 
    {
        pause = 0;
        if (all!=0) ended();
        if (all==0) 
        {
            cf = 0;
            ok = 0;
            temp=chName;
            checkSpace();
            if (ok==1) 
            {
                document.images[chName].src = x;  //***LINE 199****
            }

            if (ok==0)taken();
            process();
            if ((all==0)&&(pause==0)) myChoice();
         }
    }

function taken() {
alert("That square is already occupied.  Please select another square.")
pause=1;
}
function myChoice() {
temp="";
ok = 0;
cf=1;
logicTwo();
logicThree();
checkSpace();
while(ok==0) {
aRandomNumber=Math.random()
comp=Math.round((choice-1)*aRandomNumber)+1;
if (comp==1) temp="A";
if (comp==2) temp="B";
if (comp==3) temp="C";
if (comp==4) temp="D";
if (comp==5) temp="E";
if (comp==6) temp="F";
if (comp==7) temp="G";
if (comp==8) temp="H";
if (comp==9) temp="I";
checkSpace();
}
document.images[temp].src= "../images/carolinaWrensm.jpg";
process();
}
function ended() {
alert("The game has already ended. To play a new game click the Play Again button.")
}
function process() {
logicOne();
if (all==1){ alert("You won, congratulations!"); wn++; }
if (all==2){ alert("Gotcha!  I win!"); ls++; }
if (all==3){ alert("We tied."); ts++; }
if (all!=0) {
document.game.you.value = wn;
document.game.computer.value = ls;
document.game.ties.value = ts;
   }
}
function playAgain() {
if (all==0) {
if(confirm("This will restart the game and clear all the current scores. OK?")) reset();
}
if (all>0) reset();
}
function reset() {
all = 0;
a = 0;
b = 0;
c = 0;
d = 0;
e = 0;
f = 0;
g = 0;
h = 0;
i = 0;
temp="";
ok = 0;
cf = 0;
choice=9;
aRandomNumber = 0;
comp = 0;
document.images.A.src= blank;
document.images.B.src= blank;
document.images.C.src= blank;
document.images.D.src= blank;
document.images.E.src= blank;
document.images.F.src= blank;
document.images.G.src= blank;
document.images.H.src= blank;
document.images.I.src= blank;
if (t==0) { t=2; myChoice(); }
t--;
}




如果您需要查看它,这是它附带的html。
tictac.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
        "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>

        <title>Freebird Game: Carolina Avian Society</title>
        <meta charset=utf-8">
        <script src="//ajax.googleapis.com/ajax/libs/prototype/1.7.1.0/prototype.js"></script>
        <script src="//ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <script type="text/javascript" src="js/tictac.js"></script>
        <link rel="stylesheet" href="css/grid.css">
        <link rel="stylesheet" href="css/main.css">
</head>
<body>
            .
            .
            .
            .

            <section>
                <center>
                  <form name=game>
                      <table border=0>
                      <td>
                      <table border=1>
                      <tr>
                      <td><a href="javascript:yourChoice('A')"><img src="images/highlight-bg.png" border=0 height=100 width=100 name=A alt="Top-Left"></a></td>
                      <td><a href="javascript:yourChoice('B')"><img src="images/highlight-bg.png" border=0 height=100 width=100 name=B alt="Top-Center"></a></td>
                      <td><a href="javascript:yourChoice('C')"><img src="images/highlight-bg.png" border=0 height=100 width=100 name=C alt="Top-Right"></a></td>
                      </tr>
                      <tr>
                      <td><a href="javascript:yourChoice('D')"><img src="images/highlight-bg.png" border=0 height=100 width=100 name=D alt="Middle-Left"></a></td>
                      <td><a href="javascript:yourChoice('E')"><img src="images/highlight-bg.png" border=0 height=100 width=100 name=E alt="Middle-Center"></a></td>
                      <td><a href="javascript:yourChoice('F')"><img src="images/highlight-bg.png" border=0 height=100 width=100 name=F alt="Middle-Right"></a></td>
                      </tr>
                      <tr>
                      <td><a href="javascript:yourChoice('G')"><img src="images/highlight-bg.png" border=0 height=100 width=100 name=G alt="Bottom-Left"></a></td>
                      <td><a href="javascript:yourChoice('H')"><img src="images/highlight-bg.png" border=0 height=100 width=100 name=H alt="Bottom-Center"></a></td>
                      <td><a href="javascript:yourChoice('I')"><img src="images/highlight-bg.png" border=0 height=100 width=100  name=I alt="Bottom-Right"></a></td>
                      </tr>
                      </table>
                      </td>
                      <td>
                      <table>
                      <tr><td><input type=text size=5 name=you></td><td>You</td></tr>
                      <tr><td><input type=text size=5 name=computer></td><td>Computer</td></tr>
                      <tr><td><input type=text size=5 name=ties></td><td>Ties</td></tr>
                      </table>
                      </td>
                      </table>
                      <input type=button value="Play Again" onClick="playAgain();">
                      &nbsp;&nbsp;
                      <input type=button value="Game Help" onClick="help();">
                      &nbsp;&nbsp;
                      <input type=button value="Quit Game" onClick="quitGame();">
                  </form>
              </center>
            </section>
      .
      .
      .   
      . 
        <script type="text/javascript" src="js/tictac.js"></script>
    </body>
</html>

最佳答案

事实证明,文件名本身存在某种问题。这使我相信文件名的引用位置必须比找到的位置更多(尽管在我的一生中都找不到它们)。因此,我从头开始重新编写原始代码,但保留了图像作者的原始文件名。

我简单地用别的东西救了他们。我想,确实最好的事情有时是从头开始,一次又一步。再次感谢大家的建议。

关于javascript - Javascript图像不会显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20275385/

相关文章:

javascript - 在单元测试中覆盖匿名函数参数

javascript - 检测用户编辑时的表格单元格更改

javascript - 基本的Web Payments请求API示例

Javascript异步函数和回调嵌套

javascript - 替换javascript对象中的字段?与拼接和推,拼接的indexOf返回-1值?

javascript - window.location 可以从 https 更改为 http

javascript - 如何切换外部 CSS 文件?

javascript - 来自本地服务器上项目的 servlet 的 Angular Http.get 请求(json 数据正确返回,但不显示,确实适用于模拟 api)

javascript - Chart.js仅随机出现,在页面刷新时消失

javascript - (jquery)防止div在页面加载期间显示