jQuery, trouver si l'élément a n'importe quel texte

Je suis à traiter avec certains généré travées et je voudrais savoir qui d'entre eux ne contiennent pas de texte.

Le balisage est:

<span id="layer6">
    <span class="drag col">  Some text</span>
    <span class="drag col">  More text</span>
    <span class="drag col">  </span>
    <span class="drag col">  I also have text</span>
</span>

Je peux obtenir ceux qui ont "un texte" avec ce code, mais je ne peux pas obtenir vides:

if ($('#layer6 > span.col:contains("some text")').length > 0) {
    alert ("I have text");
}

Comment obtenir les vides? Je pense en aide .la longueur de le faire, mais je n'ai pas réussi.

InformationsquelleAutor Mircea | 2010-03-04
  1. 49
    $("span.col").each(function(){
    if (!$(this).text().trim().length) {
        $(this).addClass("foo");
    }
});

    http://jsfiddle.net/cfgr9/1/

    Évidemment, au lieu d'ajouter une classe, vous pouvez faire comme vous le souhaitez, retourner l'objet etc

    Mise à JOUR: suppression de l'étrange personnage caché après le point-virgule final qui a causé js erreur.

    • Merci Alex, cela fonctionne. Il y a un caractère illégal après votre dernier });&#8203;, mais je l'avais enlevé et il fonctionne très bien. Merci
    • C'est une bonne solution qui fonctionne, par exemple pour <p> balises souvent vide généré par la CMS.
    • J'ai été jouer avec le $("durée:vide") sélecteur, sans succès. Cette solution a fonctionné pour moi. +1
    InformationsquelleAutor Alex
  2. 9

    Utilisation filter pour filtrer les éléments qui n'ont pas de contenu textuel:

    $('#layer6 > span.col').filter(function(){
    return $(this).text().trim() != "";
}).length
    • Cela devrait fonctionner, s'il vous plaît laissez-moi essayer et je vais poster les résultats. Merci
    InformationsquelleAutor Gumbo
  3. 9
    $('span:empty').css('background-color','red');
    InformationsquelleAutor luminancedesign
  4. 5

    je ne suis pas au courant d'une telle sélecteur, mais il est facile d'écrire

    jQuery.expr[':'].vide = function(obj) {
    retour jQuery(obj).texte().replace(/^\s+|\s+$/, "").longueur == 0;
    }

    jQuery.expr[':'].hasNoText = function(obj) {
    return jQuery.trim(jQuery(obj).text()).length == 0;
}

    et puis, par exemple

    $("#layer6 span:hasNoText").text("NEW TEXT")

    juste pour les googlers " bénéficier, voici la version étendue. $("node:correspond à(/regexp/)") sélectionne les noeuds dont le texte contenu fourni correspond regexp.

        <script>
    ///:matches(regexp)    
    ///regexp is like js regexp except that you should double all slashes
    jQuery.expr[':'].matches = function(obj, index, args) {
        var m = (args[3] + "").match(/^\/(.+?)\/(\w*)$/);
        var re = new RegExp(m[1], m[2]);
        return jQuery(obj).text().search(re) >= 0;
    }
    </script>

    démo:

        <script>
    $(function() {
        $("div").click(function() {
            $("div:matches(/foobar/)").text("foobar was here")
            $("div:matches(/foo\\s+bar/i)").text("some text")
            $("div:matches(/^\\s+$/)").text("only spaces")
        });
    });
    </script>

    html before 

    <div>foobar</div>
    <div>Foo Bar</div>
    <div>       </div>

    html after 

    <div>foobar was here</div>
    <div>some text</div>
    <div>only spaces</div>
    • :vide existe: api.jquery.com/empty-selector
    • merci pour la suggestion, je vais essayer cela et vous le fait savoir
    • :vide devient l'élément avec absolument aucun texte, le contenu. Dans mon cas j'ai 2 espaces vides entre les travées: <span class="faites glisser le col"> </span>
    InformationsquelleAutor user187291