Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>This is causing an infinite loop <code>if (new Number(word_count) &lt; 0) {</code>.</p> <p>Your code is a mess altogether. Just study and start with more basic concepts and start over. If you want to describe your project to me in a comment, I would be glad to show you a good, clean, readable approach.</p> <p><strong>Update:</strong><br> Part of having a good architecture in your code is to keep different parts of your logic separate. No part of your code should know about or use anything that isn't directly relevant to it. Notice in my word counter that anything it does it immediately relevant to its word-counter-ness. Does a word counter care about what happens with the count? Nope. It just counts and sends the result away (wherever you tell it to, via the callback function). This isn't the only approach, but I just wanted to give you an idea of how to approach things more sensefully.</p> <p><a href="http://jsbin.com/uxOYODIT/3/edit" rel="nofollow">Live demo here (click).</a></p> <pre><code>/* what am I creating? A word counter. * How do I want to use it? * -Call a function, passing in an element and a callback function * -Bind the word counter to that element * -When the word count changes, pass the new count to the callback function */ window.onload = function() { var countDiv = document.getElementById('count'); wordCounter.bind(countDiv, displayCount); //you can pass in whatever function you want. I made one called displayCount, for example }; var wordCounter = { current : 0, bind : function(elem, callback) { this.ensureEditable(elem); this.handleIfChanged(elem, callback); var that = this; elem.addEventListener('keyup', function(e) { that.handleIfChanged(elem, callback); }); }, handleIfChanged : function(elem, callback) { var count = this.countWords(elem); if (count !== this.current) { this.current = count; callback(count); } }, countWords : function(elem) { var text = elem.textContent; var words = text.match(/(\w+\b)/g); return (words) ? words.length : 0; }, ensureEditable : function(elem) { if ( elem.getAttribute('contenteditable') !== 'true' &amp;&amp; elem.nodeName !== 'TEXTAREA' &amp;&amp; elem.nodeName !== 'INPUT' ) { elem.setAttribute('contenteditable', true); } } }; var display = document.getElementById('display'); function displayCount(count) { //this function is called every time the word count changes //do whatever you want...the word counter doesn't care. display.textContent = 'Word count is: '+count; } </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload