Currently developing a Firefox Addon in JavaScript. It scans a webpage for specific things like email addresses. Is there a way of being able to get it to read the source code of a website and set an event listener to a text box which can then detect whether a user is entering an email address in a text box on any website. Not sure whether this is possible in JavaScript as I am new to it. I need to be able to display an alert if the user types in an email address on a website but as this will be running from a Firefox Addon. Almost like it would display if you were using it for validation purposes on a website. But as this is from a Firefox Addon it doesn't quite work the same way. I have looked at GreaseMonkey but its quite confusing and when trying to find specifically whether it could be done I have got stuck.

How could I implement this would be great or even whether it is possible.

Currently developing a Firefox Addon in JavaScript. It scans a webpage for specific things like email addresses. Is there a way of being able to get it to read the source code of a website and set an event listener to a text box which can then detect whether a user is entering an email address in a text box on any website. Not sure whether this is possible in JavaScript as I am new to it. I need to be able to display an alert if the user types in an email address on a website but as this will be running from a Firefox Addon. Almost like it would display if you were using it for validation purposes on a website. But as this is from a Firefox Addon it doesn't quite work the same way. I have looked at GreaseMonkey but its quite confusing and when trying to find specifically whether it could be done I have got stuck.

How could I implement this would be great or even whether it is possible.

• javascript
• html
• firefox-addon
• event-listener

Share Improve this question Follow asked Mar 1, 2013 at 9:18 user2055933user2055933

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 2

You could do something like this:

window.onload = function () {
    var inputs = document.getElementsByTagName('input');
    for (i = 0; i < inputs.length; i++) {
        inputs[i].onkeypress = function () {
            if (this.value.match(/^([0-9a-zA-Z]([-\.\w]*[0-9a-zA-Z])*@([0-9a-zA-Z][-\w]*[0-9a-zA-Z]\.)+[a-zA-Z]{2,9})$/)) {
                // do something
                alert('Looks like an email address!');
            }
        };
    }
};

Try it here: http://jsfiddle/samliew/49cny/

You can add a event listener like:

Syntax

target.addEventListener(type, listener[, useCapture]);
target.addEventListener(type, listener[, useCapture, aWantsUntrusted Non-standard]); // Gecko/Mozilla only

From https://developer.mozilla/en/docs/DOM/element.addEventListener

For example

document.getElementById('inputid').addEventListener("keypress", function(){/* Your code */}, false);

You would use the jQuery .keyPress() function Below is an example...Where #target is the ID of the Textbox.

var i=0;
$( "#target" ).keypress(function() {
i++;
console.log("Kep Pressed: " + i);
}