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 

希望這有助於..