將圖像從div加載到ListView中作爲縮略圖

Question

我有一個div加載了一些HTML。我想要做的是以某種方式從這個div中獲得第一個圖像（我需要搜索「img」，因爲我無法控制他們的類/ ID）並將其作爲縮略圖放在列表視圖中。有任何想法嗎？ 這是針對Android和iPhone使用jquery/html5的phonegap應用程序。

Answer 1

實施例：

• http://jsfiddle.net/MeyvK/1/

JS：

// Append each image to the list 
$('img').each(function() { 
    var imageList = $('#thumbs'); 

    imageList.append('<li><a href="#"><img src="'+this.src+'"><h3>Thumbnail Title</h3><p>Thumbnail Description</p></a></li>'); 
}); 

// Refresh jQM Controls 
$('#thumbs').listview('refresh'); 

HTML：

<!-- images --> 
<img src="http://jquerymobile.com/demos/1.1.1/docs/lists/images/album-p.jpg" alt="full size image" /> 
<img src="http://jquerymobile.com/demos/1.1.1/docs/lists/images/album-xx.jpg" alt="full size image" /> 
<img src="http://jquerymobile.com/demos/1.1.1/docs/lists/images/album-ok.jpg" alt="full size image" /> 

<br /> 

<ul data-role="listview" id="thumbs"> 
    <li><a href="#"> 
     <img src="http://jquerymobile.com/demos/1.1.1/docs/lists/images/album-hc.jpg" /> 
     <h3>Thumbnail Title</h3> 
     <p>Thumbnail Description</p> 
    </a></li> 
</ul>​ 

Answer 2

如你沒有提供任何HTML，具有結構像這樣

文本這可能會稍微通用

更多的文字

您可以用獲取第一張圖片繼Jquery

$(document).ready(function() { 
    var html = $("div img:first").attr('src'); 
    $("#list").append("<li><img src="" + html + "" /></li>"); 
}); 

This wi將檢索div中第一個img標籤的src屬性並將圖像附加到列表中。

這是你之後的事情嗎？