1

我一直在尝试使用以下代码显示图像。旨在比较用户输入以显示正确的图片。

$(document).ready(function(){ 
var defaultimg = document.getElementById('image1');
defaultimg.src = pictureImage;
var pictureImage = "images/unknown.png";
if({{messages.get.message}} == "Mewtwo"){   
var imgobject = document.getElementById('image1');
imgobject.src = pictureImage;
pictureImage = "images/150.png";
}
if({{messages.get.message}} == "Charmeleon"){   
var imgobject2 = document.getElementById('image1');
imgobject2.src = pictureImage;
pictureImage = "images/005.png";
}

if({{messages.get.message}} == "Warturtle"){    
var imgobject3 = document.getElementById('image1');
imgobject3.src = pictureImage;
pictureImage = "images/008.png";
}


)}

到下面一段 html

<img id="image1" alt="Pokemon" width="88" height="75">&ensp;

目前它只显示一个空框。

有人可以就这种方法是否可以固定以显示图像提供建议吗？感谢您的时间和帮助。

4

2 回答 2

0

您可能想说明您使用哪种模板引擎或类似的引擎，因为“{{messages.get.message}}”在vanilla js中对您没有多大帮助（尽管它在语法上格式正确）

调试提示：

调试器；

在 js 代码中启动调试器在 chrome/firefox(+firebug)/...

否则您也可以使用控制台命令，例如 console.debug("if 1") 来找出发生了什么

也看看控制台输出一般，应该没有警告或错误。

下一步：您尝试在定义之前使用可能是全局的（因为前面缺少“var”）变量“pictureImage”。Javascript从头到尾，从左到右（我们假设它是这样以便于理解），从上到下运行。

因此，您尝试将图像的 src 设置为当时未定义的内容，然后再定义该变量。javascript中没有指向非对象类型的指针（哪些是字符串常量）

要解决您的问题，您可能必须在代码中交换一些行，以便设置 used 变量，然后使用 THEN，而不是相反。

于 2013-05-12T16:23:38.547 回答
0

这可能是一个参考循环：

$(document).ready(function(){ 
     var defaultimg = document.getElementById('image1'); 
     // defaultimg now contains image1
     // using jQuery and getElementbyId together is weired

     defaultimg.src = pictureImage;  
     // pictureImage is not assigned, so the url is empty
     // prob. cause for empty block?

     var pictureImage = "images/unknown.png"; 
     // ok, now we assign an url 

     if({{messages.get.message}} == "Mewtwo"){   
     // is that path correct?

       var imgobject = document.getElementById('image1'); 
       // copy of the empty image from above

       imgobject.src = pictureImage;       
       // we assign an url

       pictureImage = "images/150.png";    
       // new url on pictureImage, unused so far.
     }
  ...

如果没有任何条件if({{messages.get.message}} == "Mewtwo"){ 为真，则由于defaultimg.src = pictureImage; 未分配图片图像变量，它必须不显示任何内容。

于 2013-05-12T16:30:48.773 回答