Grow your CSS skills. Land your dream job.

Checking accuracy of a textarea [RESOLVED]

  • # April 30, 2009 at 2:18 am

    As you can tell by my many questions lately, I’ve been playing with javascript a lot.

    The purpose of this script is to come up with a percentage of accuracy by looking at what you typed and comparing it to the original text. Take a look:

    Code:



    Well, hello there!



    What's happening is after you type in your stuff and click on "How did I do?", the following happens:

    1) An array is created by filling in the indexes with the words of bodyText.
    2) Another array is created by filling in the indexes with the words of customWords.
    3) I created a variable consisting of how many words are in the passage of bodyText.
    4) For every word in the passage of bodyText, each word is checked with the corresponding word of customWords textarea. If a word matches, then fieldTextWordCount is incremented by 1.
    5) Accuracy is then determended by multiplying however many words of customWords matched with bodyText by 100, then dividing by however many words are in bodyText.
    6) Accuracy is outputted to the accuracy div.

    Unfortunately, after thinking all this out, it just doesn't work. Anyone see anything wrong with it?

    # April 30, 2009 at 8:56 pm

    So, with further toying around with it, I changed a couple things and got a little further. Still not doing what it’s supposed to though.

    Code:






    First I changed the bodyText div to a textarea, then changed the mainWords array to use value instead of innerHTML.

    I believe that the problem lies in var bodyTextWordCount = mainWords.length; because immediately after that, I have an alert to display the value of bodyTextWordCount. The value SHOULD be 3, but it says 1.

    I believe I'm using the length method correctly, but it's just not working right....

    # May 3, 2009 at 9:27 am

    Hi Brian,

    I messed around a little bit and managed to solve your problem; here’s a working function:

    Code:
    function checkAcc() {

    var fieldTextWordCount = 0,
    mainWords = document.getElementById(“bodyText”).value.split(” “),
    customWords = document.getElementById(“customWords”).value.split(” “),
    bodyTextWordCount = mainWords.length;

    for ( var i = 0; i < bodyTextWordCount; i++ ) {
    if(mainWords[i] == customWords[i]) {
    fieldTextWordCount++;
    }
    }

    var accuracy = (fieldTextWordCount * 100) / bodyTextWordCount;

    document.getElementById("accuracy").innerHTML = "Your accuracy was " + accuracy + "%";

    }

    The main problem was that you were trying to create an array out of an already existing array. Running the ‘split’ method on a string returns an array so there was no need to call the Array constructor on top of that.

    I.e.

    Code:
    var str = ’1 2 3′;

    // Wrong:
    new Array(str.split(‘ ‘)); // Returns [ [1,2,3] ]

    // Right:
    str.split(‘ ‘); // Return [1,2,3]

# May 3, 2009 at 4:24 pm

Thanks so much!!!

I saw the split() method on the w3c schools site, but I guess it didn’t make it clear enough that it made the array for you. This works perfectly now!

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".