Searching Body Text with textRange: Building on the Script and the VBScript Alternative (Page 1 of 4 )
Once you have the basic script for performing text searches within the text of web pages, you may want to extend the functionality of this and add a button that will find the next occurrence of the word you have searched for. This will improve the usability of the whatever web page you add this to.
Initially, you may as well add the second button to the main web page (findingText.htm). Add the following block of code directly beneath the first button, using the appropriate table tags to nestle it next to the original button:
button id=buttonNext title="Click to find the next match" onclick="searchNext()">Find Next...</button>
Now open the behaviour.js file and you can add the corresponding searchNext() function. Before doing this however, you need to know a little bit more about how the findText method works. When it finds a match for the word that has been searched for, it reduces the textRange object so that it just encompasses the matched word. What you need to do is move the text range forward by one word and then expand the textRange once more so that it covers the remaining body text.
Add the new searchNext function below the textSearch function in the behaviour file:
function searchNext() {
if (searchWord=="") {
window.alert ("No Search value entered");
return false
}
range.move("word", 1);
range.moveEnd("word", 1000);
match = range.findText(searchWord,0,2);
if (match != false) {
range.select();
} else {
window.alert ("Couldn't find any more instances of '" + searchWord + "'");
}
}
As this function also needs to make use of the searchWord, range and match variables, these need to be defined as global variables by declaring them outside of a function. Add them to the top of the file:
var strDialogValue
var range
var match
Now both of the functions can make use of the variables and share their values. The second function is very similar to the first except that instead of just returning false in the initial if statement, it also sends an alert to the user if no search word has been entered (if, for example, the user has clicked the find button, but then clicked cancel and then clicked the find next button.) It also uses the move method to move the range forward by one word, and uses the moveEnd method to move the end of the range forward by 1000 words. As there are less than one thousand words in the body of the page, this will definitely include the rest of the text. If no further matches are found, an alert is sent advising of this.
This should now be a fully working script, but it can still produce errors if it is not used correctly. If someone clicks on the find next button without having first clicked on the find button and entered a search word, the page errors. As it is possible for this to happen, is bound to happen and you should therefore incorporate into your script something that will detect whether this has happened and cater for it accordingly without producing errors.
Next: Add a Flag >>
More Code Examples Articles
More By Dan Wellman