我有一個div加載了一些HTML。我想要做的是以某種方式從這個div中獲得第一個圖像(我需要搜索「img」,因爲我無法控制他們的類/ ID)並將其作爲縮略圖放在列表視圖中。有任何想法嗎? 這是針對Android和iPhone使用jquery/html5的phonegap應用程序。將圖像從div加載到ListView中作爲縮略圖
0
A
回答
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>
0
如你沒有提供任何HTML,具有結構像這樣
文本這可能會稍微通用
更多的文字
您可以用獲取第一張圖片繼Jquery
$(document).ready(function() {
var html = $("div img:first").attr('src');
$("#list").append("<li><img src="" + html + "" /></li>");
});
This wi將檢索div中第一個img標籤的src屬性並將圖像附加到列表中。
這是你之後的事情嗎?
相關問題
- 1. 從JSON中將縮略圖圖像加載到UITableView中
- 2. 將縮略圖圖像從目錄加載到PictureBox中
- 3. jQuery爲每個縮略圖加載div直到加載
- 4. HOWTO:Long ListView wirh縮略圖延遲加載?
- 5. 在圖像縮略圖查看器中預加載圖像
- 6. 從URL加載圖像到ListView
- 7. 將圖像顯示爲縮略圖
- 8. Woocommerce遇到問題將縮略圖加載爲主要產品圖像
- 9. 在將圖像從SD加載到ListView時提高ListView效率
- 10. 使用jQuery縮略圖滾輪和加載圖像到一個div
- 11. 如何在SWT中添加圖像作爲縮略圖
- 12. 使用AsyncTask bug將位圖縮略圖加載到RecyclerView中
- 13. 對齊圖像縮略圖一個div
- 14. 縮略圖圖像 - 點擊加載圖像詳細信息
- 15. ios dropbox,在表格視圖中加載圖像的縮略圖
- 16. 負載平衡和Web圖像/縮略圖/縮略圖
- 17. 將URL中的圖片加載到ListView中的圖像查看
- 18. 將圖像添加到ListView
- 19. 如何將圖像加載到一個div中,哪個圖像從數據庫加載到另一個div
- 20. 圖像縮略圖
- 21. Facebook的縮略圖將不會加載
- 22. 加載問題縮略圖
- 23. 如何將從SD卡加載的圖像縮放到圖像視圖?
- 24. 點擊圖像縮略圖,圖像將被裝載到大尺寸
- 25. 將圖像添加到WP後縮略圖
- 26. 性能問題在RecyclerView中加載圖像縮略圖
- 27. 在jssor中重新加載圖像和縮略圖
- 28. Lazy在ListView中加載位圖圖像
- 29. 以縮略圖加載許多大型位圖圖像 - Android
- 30. 如何使用Javascript從縮略圖加載圖像到更大尺寸
已任何示例代碼共享? – shanabus 2012-07-31 13:08:47