2016-06-29 23 views
-1

Hallo Ich möchte eine Word Count in meinem RTE (Rich Text Editor) mit Javascript kann auch mit jquery verwenden. Aber es sollte nicht die HTML-Tags zählen und weiße Leerzeichen wiederholen.Wie man ein Wort zählt, das HTML-Tags mit Javascript enthält?

Beispieltext:

<p>11 22&nbsp; 33</p><p>44</p>5<br></div>

Die Javascript 5 nur angezeigt werden soll.

Gibt es einen JavaScript-Code für diese und das ist auch schnell die Word Count zu berechnen?

Danke!

+1

haben Sie diese Antwort gesehen? http://stackoverflow.com/a/14010497/622287 – kevnk

+0

@kevnk Ich versuchte, die akzeptierte Antwort, und es gibt mir dieses anderes Ergebnis nach meinem Beispieltext einfügen: Zeichen (ohne Leerzeichen): 39 Zeichen (und Leerzeichen): 41 Wörter: 3 Zeilen: 1 – howardtyler

+0

Dies kann mit jQuery.text() und String.split() und der Array.length -Eigenschaft erfolgen. Wahrscheinlich in einer Zeile. – tpdietz

Antwort

3

so etwas wie dieses versuchen: Sie erhalten die HTML im div Sie alle Tags dann entfernen und sie durch Leerzeichen ersetzen. Sie entfernen (trimmen) alle linken und rechten Leerzeichen und schließlich teilen Sie die Zeichenfolge in ein Array. Die Länge ist deine Antwort.

var cont = $("#content").html(); 
 
cont = cont.replace(/<[^>]*>/g," "); 
 
cont = cont.replace(/\s+/g, ' '); 
 
cont = cont.trim(); 
 
var n = cont.split(" ").length 
 
alert(n);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div id="content"> 
 
<p>11 22&nbsp; 33</p><p>44</p>5<br></div>

+0

hallo @roxoradev das ist großartig! besser organisiert. Kannst du den Code, den du dort gemacht hast, genauer erklären, den Regex, den du getan hast, weil ich lernen will, was deine Regex dort bedeutet. Vielen Dank! :) – howardtyler

+0

Die erste Regex enthält HTML-Tags, die durch Leerzeichen ersetzt werden.Die zweite Regex löschen mehrere Leerzeichen zum Beispiel a b -> a b. Wenn Sie denken, dass ich Ihnen geholfen habe, könnten Sie diese Antwort als die Lösung markieren. Danke: D – Roxoradev

0

Sie können Countable.js für die Live-Wortzählung verwenden, obwohl HTML-Tags nicht ignoriert werden.

1

var words = []; 
 
    function getWords(elements) { 
 
    elements.contents().each(function() { 
 
     if ($(this).contents().length > 0) return getWords($(this)); 
 
     if ($(this).text()) words = words.concat($(this).text().split(" ")); 
 
    }) 
 

 
    } 
 

 
    getWords($('<div>').html('<p>11 22&nbsp; 33</p><p>44</p>5<br></div>')); 
 
    console.log(words,words.length);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

+0

Hallo @ vladu lonut danke, aber es sollte 5. Ist das möglich? – howardtyler

+0

@howardtyler Ich habe meine Antwort aktualisiert –

1

Sie können mit dem Inhalt, indem ein Element jQuery etwas tun heikel unter Verwendung.

var str = '<p>11 22&nbsp; 33</p><p>44</p>5<br></div>'; 
 

 
var len = 0; 
 
// create a temporary jQuery object with the content 
 
$('<div/>', { 
 
    html: str 
 
    }) 
 
    // get al child nodes including text node 
 
    .contents() 
 
    // iterate over the elements 
 
    .each(function() { 
 
    // now get number or words using match and add 
 
    len += (this.textContent.match(/[\w\d]+/g) || '').length; 
 
    }); 
 

 
console.log(len);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

+0

hi @pranav C Balan das ist super danke! Kannst du erklären, was es funktioniert? weil ich mehr von js Techniken lernen möchte. Und auch für andere zu verstehen, wie Sie es getan haben. – howardtyler

+0

@howardtyler: mit mehr Details aktualisiert –