Jquery查找功能无法正常工作

时间:2015-01-27 20:50:03

标签: javascript jquery html

首先,我想说我在这里看到了所有关于此的问题,但没有一个能帮助我解决我的问题。 我有一个textarea包含一个HTML代码,我想在这个textarea中获取图像,为了做到这一点,我使用.find()函数,但不幸的是它没有工作。

HTML CODE

<textarea id='post' style='display:none;'><div dir="ltr" style="text-align: left;">
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-TGSXnxdOXok/VKG1rrYMx9I/AAAAAAAABGg/eev4GjIry1g/s1600/photo-1416339306562-f3d12fefd36f-1000x400.jpg"><img src="http://2.bp.blogspot.com/-TGSXnxdOXok/VKG1rrYMx9I/AAAAAAAABGg/eev4GjIry1g/s1600/photo-1416339306562-f3d12fefd36f-1000x400.jpg" /></a></div>
<br />Cras sit amet libero eros, in ultricies lorem. Nunc et odio neque. Maecenas vehicula interdum hendrerit. Integer hendrerit orci ullamcorper neque pellentesque feugiat. Aliquam magna metus, fringilla non ultrices id, fringilla eu erat. Phasellus lorem tortor, porttitor volutpat iaculis sed, condimentum ultricies massa. Curabitur ut malesuada elit. Nullam tortor mi, faucibus a laoreet a, ultricies ut est. Etiam erat urna, dapibus vitae sodales eu, sagittis ut nisl. Curabitur vitae tristique felis. Donec consectetur porttitor lectus ac pharetra. Mauris nulla nisi, congue quis eleifend at, dapibus eget augue. Curabitur nunc sem, feugiat sit amet facilisis quis, laoreet id mi.<br />
</div>
</textarea>

Jquery CODE

var content = $('#post').val();
var img = content.find('img').attr('src');
alert(img);

JsFiddle demo

2 个答案:

答案 0 :(得分:3)

textarea的值是一个字符串,您首先需要将其转换为DOM结构。

要获取DOM结构,您需要将您拥有的字符串包装在另一个jQuery选择器中:

var content = $($('#post').val());

它基本上是这样做的:

var myString = $('#post').val();
var content = $(myString);

请在此处查看:

var content = $($('#post').val());
var img = content.find('img').attr('src');
alert(img);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea id='post' style='display:none;'><div dir="ltr" style="text-align: left;">
<div class="separator" style="clear: both; text-align: center;">
<a href="http://2.bp.blogspot.com/-TGSXnxdOXok/VKG1rrYMx9I/AAAAAAAABGg/eev4GjIry1g/s1600/photo-1416339306562-f3d12fefd36f-1000x400.jpg"><img src="http://2.bp.blogspot.com/-TGSXnxdOXok/VKG1rrYMx9I/AAAAAAAABGg/eev4GjIry1g/s1600/photo-1416339306562-f3d12fefd36f-1000x400.jpg" /></a></div>
<br />Cras sit amet libero eros, in ultricies lorem. Nunc et odio neque. Maecenas vehicula interdum hendrerit. Integer hendrerit orci ullamcorper neque pellentesque feugiat. Aliquam magna metus, fringilla non ultrices id, fringilla eu erat. Phasellus lorem tortor, porttitor volutpat iaculis sed, condimentum ultricies massa. Curabitur ut malesuada elit. Nullam tortor mi, faucibus a laoreet a, ultricies ut est. Etiam erat urna, dapibus vitae sodales eu, sagittis ut nisl. Curabitur vitae tristique felis. Donec consectetur porttitor lectus ac pharetra. Mauris nulla nisi, congue quis eleifend at, dapibus eget augue. Curabitur nunc sem, feugiat sit amet facilisis quis, laoreet id mi.<br />
</div>
</textarea>

答案 1 :(得分:2)

首先需要让jQuery解析textarea中的HTML。只需将$('#post').val()包装在jQuery对象中。

var content = $($('#post').val());
var img = content.find('img').attr('src');
alert(img);

演示:http://jsfiddle.net/0f9tjrs2/