CODEWITHSUNDEEP
jquery
francadaval
francadaval

Reputation: 2481

JQuery text function returns repeated text. Why?

I have this piece of html:

<div class="participant inline_part" data-part-id="37aaae8">
    [...]
    <div class="member_1 inline_member">
        [...]
        <span class="member_name"><a class="aLink" href="/user/15">Bob Moidusen</a></span>
    </div>
    <div class="member_2 inline_member">
        [...]
        <span class="member_name">Mark Sidhuescu</span>    
    </div>
</div>

If I call:

$("div[data-xct-part-id='37aaae8'] div.member_1 .member_name").text();

and

$("div[data-xct-part-id='37aaae8'] div.member_2 .member_name").text();

It returns me "Bob MoidusenBob Moidusen" and "Mark SidhuescuMark Sidhuescu".

Why?

[EDITED] I have the same problem with succesive calls to find:

$("div[data-xct-part-id='37aaae8']").find("div.member_2").find(".member_name").text();

I'd like to understand this in order to avoid future similar problems.

Upvotes: 0

Views: 640

Answers (4)

francadaval
francadaval

Reputation: 2481

There was two elements that matched the selection. So, acording to text() specifications (Get the combined text contents of each element in the set of matched elements, including their descendants, or set the text contents of the matched elements.), the text was returned twice.

Upvotes: 0

JPS
JPS

Reputation: 426

It seems, that it does not do this.

I have put your example up in a fiddle (and fixed search query, removing the "xct"):

http://jsfiddle.net/jppresents/jy5jrd2s/

console.log('Result query 1:' + $("div[data-part-id='37aaae8'] div.member_1 .member_name").text());
console.log('Result query 2: ' + $("div[data-part-id='37aaae8'] div.member_2 .member_name").text());

Results in this output in the console:

Result query 1:Bob Moidusen
Result query 2: Mark Sidhuescu

At least when using jquery 1.11.0 as shown in the linked fiddle.

Upvotes: 1

Sudharsan S
Sudharsan S

Reputation: 15393

Use map in jquery

var res = $(".inline_member span.member_name").map(function() {

         return $(this).text();
}).get();

console.log(res);

or

$("div.member_1 .member_name").text()
$("div.member_2 .member_name").text()

Fiddle

Upvotes: 0

Bird87 ZA
Bird87 ZA

Reputation: 2160

Change your calls to 

$("div[data-xct-part-id='37aaae8'] div.member_1 > .member_name").text();
$("div[data-xct-part-id='37aaae8'] div.member_2 > .member_name").text();

That should solve your problem.

As to WHY it's doing it, I'm not sure.

Upvotes: 0

Related Questions