JQuery的：图片不能在图片标签

Question

我在图像tag.My问题结合动态图像时被荫无法在名称中包含space.Here显示图像绑定是代码：

   for(var i=0;i<length;i++) 
       { 
           alert(names[i]); 
         <img style="width:100px;height:100px" src="Water lilies.jpg"></img>/////This code works if name is given directly 
        imageTags='<img style="width:100px;height:100px" src=' +names[i]+ '></img>'; 
       $("#images").append(imageTags); 
       } 

Iam在警报中获取两个图像名称 - “Sunset.jpg”和“Water lillies.jpg”。 我可以看到图像sunset.jpg，但不是Water lillies.jpg。 在控制台图像标签看起来喜欢这样的：

  <img style="width:100px;height:100px" src="Water" lilies.jpg> 

，并得到了一个错误：“无法加载资源” 但是当我避免水和百合花它之间的空间我works.How可以解决这个问题？ ？

感谢

Answer 1

在一般情况下：

如果属性值包含空格，则必须加引号。你没有包含引号。

src="' + names[i] + '"> 

但是通过将字符串混合在一起构建HTML是容易出错和难以阅读的。不要做：

var img = jQuery('<img>'). 
      attr('src', names[i]). 
      css({ width: "100px", height: "100px" }); 

在这种特殊情况下：

网址不能包含（文字）的空间。对它们进行编码。

var img = jQuery('<img>'). 
      attr('src', encodeURIComponent(names[i])). 
      css({ width: "100px", height: "100px" }); 

Answer 2

 imageTags='<img style="width:100px;height:100px" src=' +names[i]+ '></img>'; // your code 
     imageTags='<img style="width:100px;height:100px" src="' +names[i]+ '"></img>'; // change 

希望这有助于..