JQuery wählen Sie die übergeordnete basierend auf Kind mit genauen Text

Question

Ich habe das folgende Problem Ich kann scheinen zu arbeiten: Ich habe eine Reihe von Eltern span enthält einen anderen Satz von Tags, von denen aber nur 1 andere mit einem Text innerhalb. Ich möchte die Eltern extrahieren, deren innere Spannweite den genauen Text hat!

<span class="parent" id="1"> 
 
    \t <p>..</p><p>..</p> 
 
    \t <span>text</span> 
 
    \t <a>..</a> 
 
    </span> 
 
    <span class="parent" id="2"> 
 
    \t <span>some text</span> 
 
    \t <a>..</a> 
 
    </span> 
 
    .... 
 
    <span class="parent" id="n"> 
 
    \t <p>..</p> 
 
    \t <span>other</span> 
 
    </span>

Wenn ich nach "Text" Ich möchte nur die Spanne mit id == "1"

Mein ursprünglicher Versuch mit enthält den Wert 2 Spannweiten -> id == 1 und id == 2:

var current = "text"; 
var element = $('.parent:contains(' + current + ')'); 

ich auch mit Filter versucht haben, die in meiner bescheidenen Meinung nach funktionieren sollte aber nicht :(nicht

var element = $('.parent').filter(function() { 
        return ($(this).children().text()==current); 
       }); 

oder

var element = $('.parent').filter(function() { 
        return ($(this).children('span').text() == current) 
       }); 

Jede Hilfe wäre sehr dankbar, vielen Dank!

Answer 1

können Sie versuchen:

var current = "text"; 
var test = $('.parent').children().filter(function() { 
    return $(this).text() === current; 
}); 

Es sieht aus wie einer von euch Lösung, aber ich versuchte, meine und es funktionierte. Sie können es hier versuchen: https://jsfiddle.net/amwadqm3/.

Answer 2

Wenn Sie die unnachgiebig sind über die Verwendung von:() enthält CSS-Selektor, dann sollten Sie den Code wie folgt aussehen:

var contents = "test"; 
var element = $('.parent :contains(' + current + ')').parent(); 

Hinweis der Raum zwischen .parent und :contains(). Dadurch werden die Kinder für den gegebenen Text einzeln betrachtet und das Element zurückgegeben, in dem sie gefunden wurde. Dann müssen Sie .parent() verwenden, um das übergeordnete Element abzurufen.

Jedoch wird dies fehlschlagen, wenn der Text, der in :contains() platziert wird, Sonderzeichen hat. Es gibt auch falsche positive Ergebnisse, wenn ein Childs-Text den gegebenen Text enthält, aber nicht genau übereinstimmt.

Stattdessen können wir eine leicht modifizierte Version des Filters verwenden Sie auf dem Laufenden:

var current = "test"; 
var element = $(".parent").children().filter(function(){ 
    return $(this).text() == current; 
}).parent(); 

Auch hier beachten Sie, dass dies die Kinder der Eltern-Filter durch und nicht die Eltern selbst.

Answer 3

Sie können Elternelement mit: enthält oder Filterfunktion. Wenn Sie kein übergeordnetes Element mit: contains oder filter Funktion erhalten, können Sie jede Schleife verwenden:

var content = 'test'; 
var element = ''; 

$('.parent').each(function() { 
    var inner_text = $(this).find('span').text(); 
    if(inner_text == content) { 
     element = $(this); 
    } 
});