Question

我有一个div，我已经加载了一些HTML。我想要做的是以某种方式从这个div获取第一个图像（我需要搜索“img”，因为我无法控制他们的类/ ID）并将其作为列表视图中的缩略图。有任何想法吗？这是针对Android和iPhone使用jquery / html5的手机应用程序。

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

检索第一个img

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

这将检索div中第一个img标记的src属性，并将图像附加到列表中。

这是你要追求的那种东西吗？

将div中的图像作为缩略图加载到ListView中

2 个答案: