在div中添加隨機數的圖像

我有一個<div>，我想添加圖像到它。圖像的數量會隨機變化。在div中添加隨機數的圖像

這裏就是我試圖做

$(document).ready(function() { 
    var img = document.getElementById("img"); 
    $('#button').click(function() { 
     var randomnumber = Math.floor(Math.random() * 11) + 1; 
     for (var i = 1; i < = randomnumber; i++) { 
      $(this).append(img); 
     } 
    }); 
});

但它無法正常工作。請幫助

這裏是我的代碼JSFiddle

來源

2014-02-17 insanity

我會建議提供[的jsfiddle（http://jsfiddle.net/ ）顯示你的問題在行動 – musefan

你的＃按鈕是什麼樣的元素？它是

是的，它是按鈕 – insanity

你應該使用克隆西蒙建議，或者您可以創建新的圖像：

function getImage(){ 
    var img = new Image(); 
    img.src = "http://cdn.acidcow.com/pics/20110830/lolcats_ever_13.jpg" 
    img.width = 200; 
    return img; 
} 

var rand = Math.floor(Math.random() * 11) + 1, 
    imgContainer = $("#imgContainer"), 
    i; 

$("#imgNo").text(rand); 

for (i=0; i<rand; i++){ 
    imgContainer.append(getImage()); 
}

fiddle

來源

2014-02-17 12:38:27

非常感謝。有用 – insanity

您需要克隆的圖像：

$(this).append($(img).clone());

你的方式總是把相同的圖像（只有一個實例！）的次DIV隨機量內。所以最終只有一個圖像。

如果你複製它每一次，那麼你將有圖像

來源

2014-02-17 12:24:08 smnbbrv

內部循環，如果我正在做的任何警報，那麼它不顯示。我應該怎麼做才能使它工作 – insanity

我無法想象OP想要使用'this'，因爲這將意味着'＃button'元素被附加到... – musefan

-1

你得到的ID元素的施氮量，所以附加元素總是有ID =「IMG」相同的元素。閱讀有關jQuery find()以查找所有元素。

來源

2014-02-17 12:24:49 Radzikowski

這個問題不在於檢索'img'元素。這是關於它如何使用，你回答沒有幫助解決 – musefan

呃，你沒有定義任何新的圖像。我不知道你從哪裏得到你的圖像。如果你有不同的圖像，你可以使用下一個循環。除此之外，this指向#button元素。不知道它是哪個項目，但如果它是一個輸入按鈕，那麼它將不起作用。您必須使用div或article或section ...作爲目標。

$(document).ready(function() { 
    $('#button').click(function() { 
     // random number 
     var randomnumber = Math.floor(Math.random() * 11) + 1; 
     // insert images 
     for (var i = 1; i < = randomnumber; i++) { 
      // create a new img - element 
      var img = document.createElement('img'); 
      // give it an id 
      img.attr("id","img_" + i); 
      // source, link 
      img.attr("src","your_URL_here"); 
      // put newly created image in the div with id yourDivIdHere 
      $('#yourDivIdHere').append(img); 
     } 
    }); 
});

的id必須是唯一的，這就是爲什麼我使用的索引for循環新創建的元素的id。對於多個HTML元素具有相同的id可能會導致問題。

#yourDivIdHere指id爲yourDivIdHere股利，像

<div id="yourDivIdHere"></div>

當您重新使用按鈕，只需清除使用$('#yourDivIdHere').empty()法的內容，如果你不希望看到的是舊圖像點擊按鈕後仍然存在。

來源

2014-02-17 12:36:15 KarelG

在div中添加隨機數的圖像

回答

相關問題