How to create my own HTMLEvent onMyOwnEvent="alert('Hey
-
- Posts: 4
- Joined: December 20th, 2007, 7:10 am
How to create my own HTMLEvent onMyOwnEvent="alert('Hey
Hi there,
i've read through lot of documents know and I still can't find anything that helps me with my problem:
I want to write a Web-Site where I can add my own events into almost any HTML-Tag. Just like this:
<div onMyOwnEvent="alert('Hey' + e.someData);">...</div>
Now I do want to trigger the "MyOwnEvent" from my extension whenever I want.
Obviously I want to trigger it in a way that the JavaScript defined there doesn't get executed by my Extension for security reasons. Also I do want to pass some extra data in an event-object like other events do.
How can i implement such a thing?
Thanks a lot in advance.
i've read through lot of documents know and I still can't find anything that helps me with my problem:
I want to write a Web-Site where I can add my own events into almost any HTML-Tag. Just like this:
<div onMyOwnEvent="alert('Hey' + e.someData);">...</div>
Now I do want to trigger the "MyOwnEvent" from my extension whenever I want.
Obviously I want to trigger it in a way that the JavaScript defined there doesn't get executed by my Extension for security reasons. Also I do want to pass some extra data in an event-object like other events do.
How can i implement such a thing?
Thanks a lot in advance.
-
- Posts: 2810
- Joined: November 15th, 2004, 5:03 am
??
http://developer.mozilla.org/en/docs/Co ... eged_pages
http://forums.mozillazine.org/viewtopic.php?t=171216
Maybe you want both the event listener and to "createEvent" in the page's document. If only the current page/tab/window window.content.document from the extension.
http://developer.mozilla.org/en/docs/Co ... eged_pages
http://forums.mozillazine.org/viewtopic.php?t=171216
Maybe you want both the event listener and to "createEvent" in the page's document. If only the current page/tab/window window.content.document from the extension.
-
- Posts: 4
- Joined: December 20th, 2007, 7:10 am
Hi Max,
thanks for the links. But i really don't want to "hack" this by appending other child elements to the domtree. I really want to create a new event which can be used like any other event in the HTML domtree. Like the good old onLoad="javascript" onChange="javascript" way just with my new event. So the HTML on the web-site just needs to do <div onBlah="takesomeaction();"> and i want to trigger "Blah" from my extension.
Any ideas?
thanks for the links. But i really don't want to "hack" this by appending other child elements to the domtree. I really want to create a new event which can be used like any other event in the HTML domtree. Like the good old onLoad="javascript" onChange="javascript" way just with my new event. So the HTML on the web-site just needs to do <div onBlah="takesomeaction();"> and i want to trigger "Blah" from my extension.
Any ideas?
-
- Posts: 4
- Joined: December 20th, 2007, 7:10 am
Hmm, i thought I already explained that. However I can give you more details if that helps:
I'm writing an extension which will add some buttons to the toolbar. Whenever the users presses a button in the toolbar i want an event to be triggered on the HTML-Dom.
So on the HTML-Page i want to have code like this:
<html>
...
<div onToolBarButtonPressed="alert('Omg, somebody pressed a button in the toolbar');">...</div>
</html>
My toolbar button obviously needs to trigger the "onToolBarButtonPressed" event on the HTML-Dom. Unfortunately there is no such event. So I need to create that somehow.
I'm writing an extension which will add some buttons to the toolbar. Whenever the users presses a button in the toolbar i want an event to be triggered on the HTML-Dom.
So on the HTML-Page i want to have code like this:
<html>
...
<div onToolBarButtonPressed="alert('Omg, somebody pressed a button in the toolbar');">...</div>
</html>
My toolbar button obviously needs to trigger the "onToolBarButtonPressed" event on the HTML-Dom. Unfortunately there is no such event. So I need to create that somehow.
-
- Posts: 2810
- Joined: November 15th, 2004, 5:03 am
Fire "myevent" on web page element from extension
Fire "myevent" on web page element from extension with extra data as attribute "myextra". Listener reads "onmyevent" and "myextra" attributes of the element, and executes "onmyevent".
Fire event from extension:Add listener to page:
Fire event from extension:
Code: Select all
function myEvent(aId, aExtra){
//*** aId is id of element
//*** aExtra is passed as attribute "myextra" of element
//*** content.document is document of current page
var doc = content.document;
var elm = doc.getElementById(aId);
if (elm && "createEvent" in doc) {
//*** set myextra atteribute on elm
elm.setAttribute("myextra", aExtra);
//*** fire myevent on elm
var evt = doc.createEvent("Events");
evt.initEvent("myevent", true, false);
elm.dispatchEvent(evt);
}
}
myEvent("my-div", "some extra info");
Code: Select all
<script type="application/x-javascript">
function myeventListener(event){
var elm = event.target;
var att = elm.getAttribute("onmyevent");
//*** attribute "myextra" is set in extension code
var myextra = elm.getAttribute("myextra");
if (elm && att){
//*** onmyevent can use above variables cause it executed here
//*** execute (eval) in scope of page's window object
window.eval(att);
}
//*** clean up
if (elm.hasAttribute("myextra"))
elm.removeAttribute("myextra");
}
window.addEventListener("myevent",myeventListener,false);
</script>
<div id="my-div"
onmyevent="alert('Omg, somebody pressed a button for ' +elm.id +'\n' +myextra);"
>...</div>
-
- Posts: 2810
- Joined: November 15th, 2004, 5:03 am
-
- Posts: 122
- Joined: November 16th, 2007, 10:01 pm
Sorry to re-open this. But I've a similar case:
I want the javascript within my.html to communicate with XUL elements. BTW, the above iframe is a XUL iframe.
What's the best way? Is that possible?
Code: Select all
<iframe id="content-body" src="chrome://myext/content/my.html" height="20" width="300" scrolling="false"/>
<iframe id="content-body1" src="http://www.mysite.com/my.html" height="20" width="300" scrolling="false"/>
I want the javascript within my.html to communicate with XUL elements. BTW, the above iframe is a XUL iframe.
What's the best way? Is that possible?
-
- Posts: 2810
- Joined: November 15th, 2004, 5:03 am
If you mean to send data from a web page to chrome, you set an attribute or property and create an event somewhere in the page and listen for it in the chrome that is an ancestor. The ancestor, perhaps a chrome: (xul) window, dialog or page that those 2 iframes may be in. When you get the event read the attribute or property from the web page.
http://developer.mozilla.org/en/docs/Co ... eged_pages
Basically you use the web page as the data storage (attributes or properties) and the place to create the events, since the chrome (ancestor) and the web page (descendant) both have read/write capability on the web page's window object on down to do so. Both can also listen for the events and get the data from the web page. The web page doesn't have the same read/write freedoms with chrome code.
http://developer.mozilla.org/en/docs/Co ... eged_pages
Basically you use the web page as the data storage (attributes or properties) and the place to create the events, since the chrome (ancestor) and the web page (descendant) both have read/write capability on the web page's window object on down to do so. Both can also listen for the events and get the data from the web page. The web page doesn't have the same read/write freedoms with chrome code.
-
- Posts: 122
- Joined: November 16th, 2007, 10:01 pm
I implemented this and works fine.
One thing that did trouble was sending object to the webpage. By the time the object reached the event handler on the webpage it had lost all it's data members. Which is strange. So I had to send JSON encoded string and create the final object on the webpage.
Wish, if there was some better but secured way. Thanks anyways.
One thing that did trouble was sending object to the webpage. By the time the object reached the event handler on the webpage it had lost all it's data members. Which is strange. So I had to send JSON encoded string and create the final object on the webpage.
Wish, if there was some better but secured way. Thanks anyways.
-
- Posts: 2810
- Joined: November 15th, 2004, 5:03 am
-
- Posts: 122
- Joined: November 16th, 2007, 10:01 pm
-
- Posts: 2810
- Joined: November 15th, 2004, 5:03 am
Yes, automatically toString because an attribute is a string.
Also for cleanup can set the property equal to null or or just delete it.
elm.x = null;
or
delete elm.x;
Also for cleanup can set the property equal to null or or just delete it.
elm.x = null;
or
delete elm.x;