Gokhan Posted October 23, 2014 Share Posted October 23, 2014 Hello all, I was trying to use the event attributes but there is no example for these three attributes on W3Schools tutorials. Also I looked for it on Google and I coudn't find any. Could you please give me small examples which uses these three attributes? All the examples on internet uses JavaScript to provide this functions but I want to see how this attributes work. I cannot find out how to trigger these attributes. Thanks in advance! Link to comment Share on other sites More sharing options...
Ingolme Posted October 23, 2014 Share Posted October 23, 2014 You can find information about all Javascript events at the Mozilla Developer Network: https://developer.mozilla.org/en-US/docs/Web/Events Many events are only intended to work with Javascript. Event attributes inside the HTML, while not officially deprecated, shouldn't be used because it makes maintaining websites really difficult. It's important to separate content from behavior. Link to comment Share on other sites More sharing options...
Gokhan Posted October 23, 2014 Author Share Posted October 23, 2014 (edited) You can find information about all Javascript events at the Mozilla Developer Network: https://developer.mozilla.org/en-US/docs/Web/Events Many events are only intended to work with Javascript. Event attributes inside the HTML, while not officially deprecated, shouldn't be used because it makes maintaining websites really difficult. It's important to separate content from behavior. Thanks for your answer but I have already read this page. However I want to see an example with attributes. My aim is to see how they work. I am not able to create an example as I am not so familiar with JS. Where can I find such an example. I just want to see how these attributes are triggered. I have made an attemp but it didn't work. The example codes are below: <!DOCTYPE html><html><head><title>Main Page</title></head><body><iframe src="frame.html" id="frame" style="height:60px"></iframe><form name="form"> <input type="text" name="name" value="Enter your name:"/> <input type="submit"/></form><script> var mainw = document.getElementById("frame").contentWindow document.forms.form.onsubmit = function() { mainw.postMessage( this.elements.name.value, "frame.html" ) return }</script></body></html> <!DOCTYPE html><html><head><title>Frame</title></head><body onmessage="receiver(event)"><div id="box">Your name is: </div><script>function receiver(event){ document.getElementById("box").innerHTML = event.data}</script></body></html> It doesn't work. If it is possible to make it work with some modifications could you please do this? Edited October 23, 2014 by Gokhan Link to comment Share on other sites More sharing options...
Ingolme Posted October 23, 2014 Share Posted October 23, 2014 Events are Javascript. If you really want to learn events you have to know Javascript. If you want to see how they work many of them only make sense in the context of a script, which is why the examples are all Javascript. For example, the "message" event cannot be applied to an HTML element, it's applied to Javascript web sockets and server-sent events which have no HTML involved in them. The "storage" event only makes sense in the context of Javascript's sessionStorage and localStorage objects, there's absolutely no relation with HTML there. Link to comment Share on other sites More sharing options...
Ingolme Posted October 23, 2014 Share Posted October 23, 2014 This page explains Web Messaging: https://developer.mozilla.org/en-US/docs/Web/API/Window.postMessage The message event belongs to the Javascript window object: window.addEventListener("message", receiveMessage, false); Here's the documentation on how and why to use addEventListener for events: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget.addEventListener Link to comment Share on other sites More sharing options...
Gokhan Posted October 23, 2014 Author Share Posted October 23, 2014 (edited) This page explains Web Messaging: https://developer.mozilla.org/en-US/docs/Web/API/Window.postMessage The message event belongs to the Javascript window object: window.addEventListener("message", receiveMessage, false); Here's the documentation on how and why to use addEventListener for events: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget.addEventListener Actually I am going to learn JavaScript and I am not asking for an example which doesn't include JavaScript code. What I wanted was just to see "onmessage" attribute is working. Do you say it has no functionality for now (therefore there can't be an example which triggers "onmessage" attribute) althought the HTML5 specification includes it? Edited October 23, 2014 by Gokhan Link to comment Share on other sites More sharing options...
Ingolme Posted October 23, 2014 Share Posted October 23, 2014 (edited) I'm just saying that onmessage is not an HTML attribute, the message event only works on the Javascript window object. Update: window events can be put on the <body> element. But understanding what the "message" event does requires some intermediate knowledge of Javascript. If the event is not working there has to be something wrong with the Javascript. Event listener examples don't use HTML attributes for their event listeners because it's a bad practice. If you're still only learning HTML then wait until you begin Javascript before trying to learn events. Edited October 23, 2014 by Ingolme Clarification Link to comment Share on other sites More sharing options...
Gokhan Posted October 23, 2014 Author Share Posted October 23, 2014 I will do what you suggest. It would be good to see an example but there is not even one on the whole internet. I think if I request you to write an example for me it would take much of your time. Could you help me if I cannot make these attributes work even after I have learnt JavaScript? Link to comment Share on other sites More sharing options...
Ingolme Posted October 23, 2014 Share Posted October 23, 2014 Just a side note: I've never actually needed to use those events in all the years I've been working with Javascript, however they would be useful if I was building a complex web application. Here's a secret: We developers don't memorize every feature of the language, we learn the syntax and structure of the language but don't go on to read about every single detail of it. I know how to handle events, but I haven't memorized every kind of event there is and what to use it for. My knowledge of how events work makes learning a new type of event really easy for me. There probably isn't a good reason for you to learn about the message event at the moment, the only thing that you have to learn is that there exists an interface to communicate between different windows (which uses the message event) and that you can look that up if you ever encounter a situation that needs it. In response to your question: Yes, I can help you make your script work when you try things in Javascript. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now