Web Analytics Made Easy -
StatCounter Help with a find in page script. - CodingForum

Announcement

Collapse
No announcement yet.

Help with a find in page script.

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Help with a find in page script.

    This is my code:

    Code:
     
    
    <script>
    
    function findInPage() {
    var trueFalse=false;
    var divId=document.getElementById('div');
    var inputField=document.getElementById('input');
    var caseInsensitive=divId.innerHTML.toLowerCase();
    var word=caseInsensitive.split(' ');
    for(var i=0;i<divId.innerHTML.length; i++){
    if(inputField.value.toLowerCase()==word[i]){
    alert("found at "+i)
    trueFalse=true;
    }else if(trueFalse==false){
    alert("Not found");
    }
    }
    }
    </script>
    
    
    <input type="text" id="input"><input type="submit" onclick="findInPage();" value="Find"><BR><BR>
    <div id="div" style="border:1px solid black;height:500px;width:500px;">
    
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam pellentesque 
    metus in lectus. Sed sed sapien sed eros rhoncus facilisis. Morbi vestibulum, 
    diam non tincidunt imperdiet, ligula quam lacinia enim, molestie venenatis massa 
    ante a erat. Nunc sed justo quis lorem posuere molestie. Nam eget orci sagittis 
    risus imperdiet aliquet. Nullam est ipsum, sagittis id, varius ac, cursus ut, 
    leo. Morbi ultricies ligula eget massa. Ut sagittis dui ac risus. Phasellus 
    facilisis nunc ac sapien luctus ullamcorper. Nulla ullamcorper lacinia turpis. 
    Maecenas varius. Proin volutpat odio quis nisl. Ut vitae nibh. Cras pharetra 
    placerat mauris. Donec consequat pretium wisi. Suspendisse non eros. Donec 
    pulvinar diam vitae velit. Proin aliquam tortor vel pede faucibus interdum. 
    
    </div>
    Basically, I want it so when you type a word and it is found, it shows how many words from the beggining it is. And if the word is not found, for an alert to come up and say so. My problem is that whenever I type "Lorem", the alert comes up saying it was found as word number 0 and number 40 right? Well, thats all fine and dandy, but when I try to type "ipsum" or any other word, it tells where the word is located AND that it can't be found. Can someone help? I was kind of figuring a "break" or "continue" should go in ther somewhere but I tried all that and still didn't work. What do I do?
    Single Paradox
    My Site (Under construction)

    Not too bad for a 15 year old

  • #2
    Try this:
    Code:
    function findInPage() {
      var trueFalse=false;
      var divId=document.getElementById('div');
      var inputFieldValue=document.getElementById('input').value.toLowerCase();
      var caseInsensitive=divId.innerHTML.toLowerCase();
      var word=caseInsensitive.split(' ');
      for(var i=0;i<word.length; i++){
        if(inputFieldValue==word[i]){
           trueFalse=true;
           break;
        }
      }
      if (trueFalse){
        alert("found at "+i);
      }else{
        alert("Not found");
      }
    }
    Glenn
    vBulletin Mods That Rock!

    Comment


    • #3
      Moving the else if out of the loop will fix your script to find every occurrence.
      Use 'word' to get the array length as glenngy has it.
      Code:
         for(var i=0;i<word.length; i++){
          if(inputField.value.toLowerCase()==word[i]){
             alert("found at "+i)
             trueFalse=true;
              }
          }
           if (trueFalse==false){
              alert("Not found");
          }
      Your script will fail to find words that have punctuation as the last character.
      Last edited by rwedge; Aug 2, 2005, 12:00 AM. Reason: Converting to lower case once as glenngy has done is more efficient that doing it in the loop.

      Comment


      • #4
        Thank you both, and yes wedge I realize this, don't worry it will be fixed.
        Single Paradox
        My Site (Under construction)

        Not too bad for a 15 year old

        Comment


        • #5
          Ok, I am now having trouble taking everything before the word and getting it into a variable and taking everything after the word. i just want you to know that the alerts were just for testing reasons. I would just use:

          divId.innerHTML=divId.innerHTML.substr(0,i);

          But since my "i" variable is in spaces not charactors, that would come up with a lot less charactors than needed. I also tried:

          divId.innerHTML=divId.innerHTML.split(' ').substr(0,i);

          Which yielded no results but gave me an error message.
          Can someone help please?
          Single Paradox
          My Site (Under construction)

          Not too bad for a 15 year old

          Comment


          • #6
            Can someone please help, I have been unsuccessful finding any answers.
            Single Paradox
            My Site (Under construction)

            Not too bad for a 15 year old

            Comment


            • #7
              Can you post the latest code for the findInPage() function?
              Glenn
              vBulletin Mods That Rock!

              Comment


              • #8
                I'm sorry, certainly:

                Code:
                <script>
                
                function findInPage() {
                var trueFalse=false;
                var divId=document.getElementById('div');
                var inputField=document.getElementById('input').value.toLowerCase();
                var caseInsensitive=divId.innerHTML.toLowerCase();
                var word=caseInsensitive.split(' ');   
                for(var i=0;i<word.length; i++){
                  if(word[i]==inputField||word[i]==inputField+"."||word[i]==inputField+","||word[i]==inputField+"?"||word[i]==inputField+"!"||word[i]==inputField+";"||word[i]==inputField+":"){
                       alert("found at "+i)
                       trueFalse=true;
                        }
                    }
                     if (trueFalse==false){
                        alert("Not found");
                    }
                }
                </script>
                
                <input type="text" id="input"><input type="submit" onclick="findInPage();" value="Find"><BR><BR>
                <div id="div" style="border:1px solid black;height:500px;width:500px;">
                
                Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam pellentesque 
                metus in lectus. Sed sed sapien sed eros rhoncus facilisis. Morbi vestibulum, 
                diam non tincidunt imperdiet, ligula quam lacinia enim, molestie venenatis massa 
                ante a erat. Nunc sed justo quis lorem posuere molestie. Nam eget orci sagittis 
                risus imperdiet aliquet. Nullam est ipsum, sagittis id, varius ac, cursus ut, 
                leo. Morbi ultricies ligula eget massa. Ut sagittis dui ac risus. Phasellus 
                facilisis nunc ac sapien luctus ullamcorper. Nulla ullamcorper lacinia turpis. 
                Maecenas varius. Proin volutpat odio quis nisl. Ut vitae nibh. Cras pharetra 
                placerat mauris. Donec consequat pretium wisi. Suspendisse non eros. Donec 
                pulvinar diam vitae velit. Proin aliquam tortor vel pede faucibus interdum. 
                </div>
                Single Paradox
                My Site (Under construction)

                Not too bad for a 15 year old

                Comment


                • #9
                  What I am going to end up doing is when the word is found, the div innerHTML will be remade and everything before the find will be there, then a span with red text showing that the word was found, then the rest of the content.
                  Single Paradox
                  My Site (Under construction)

                  Not too bad for a 15 year old

                  Comment


                  • #10
                    I know it would work only if the split function could come before the substr function.

                    word.substr(0,i);

                    Only thing it doesn't work, is there any alternative or can anyone help make this work?
                    Single Paradox
                    My Site (Under construction)

                    Not too bad for a 15 year old

                    Comment


                    • #11
                      Can someone please help me? I need this script done.
                      Single Paradox
                      My Site (Under construction)

                      Not too bad for a 15 year old

                      Comment


                      • #12
                        Just realize that you don't need a loop and just use regex.

                        Script:
                        Code:
                        function findInPage() {
                          var div = document.getElementById('div');  
                          var regex = new RegExp("\\b(" + document.getElementById('input').value + ")\\b", "gi");
                          div.innerHTML = div.innerHTML.replace(regex, '<span class="match">$1</span>');
                          if (RegExp.$1 == ""){
                             alert("Not found.");
                          }
                        }
                        CSS:
                        Code:
                        .match {
                          color: red;
                        }
                        Last edited by glenngv; Aug 4, 2005, 12:18 AM.
                        Glenn
                        vBulletin Mods That Rock!

                        Comment


                        • #13
                          Wow that's all I had to do? Thank you very much Glen, I might be the first 13 year old with a couple gray hairs at the end of trying to figure it out but you saved me! Thanks again.
                          Single Paradox
                          My Site (Under construction)

                          Not too bad for a 15 year old

                          Comment

                          Working...
                          X