How to change the src and reload an iframe with DOJO?
I want to click on a link, pull the src of the link, and use that src to refresh an iframe in my page.
dojo.ready(function() {
dojo.query(".link").onclick(function(e) {
var node = e.target;
var url = dojo.attr(node, "href");
document.getElementById("audioiframe").src = url;
dojo.stopEvent(e);
});
});
I could do this quickly in OG Javascript or jQuery, but need to use DOJO.
Thank you
UPDATE: After incorporating Strife25 answer my code is:
dojo.ready(function() {
dojo.query(".audiolink").forEach(function(link){
dojo.connect(link, "onclick", null, function(e){
var node = e.target;
var url = dojo.attr(node, "href");
dojo.query("#audioiframe").attr("src", url);
dojo.stopEvent(e);
});
});
});
The event is attached to the links, the iframe src attribute is updated, but the onclick event is not canceled and the page behaves as if the link is clicked. It appears as i开发者_Go百科f dojo.stopEvent(e);
is not working (asking where to download the MP3 File). Also, the iframe is not reloading but I believe that is due to the click not being canceled.
UPDATE: I am the bug, not the code! I was linking to the MP3 versus the page that housed the MP3 (long story). It works. Thank you.
You're attaching the click event in the wrong way, you should use dojo.connect to attach event handlers. Also, dojo.query() returns a NodeList when it runs instead of a single node.
The proper way to use dojo in this instance would be:
dojo.query(".link").forEach(function(link){
dojo.connect(link, "onclick", null, function(e){
//do your stuff
});
});
If you only have one button that performs the onclick event you are proposing, you should instead use dojo.byId like so:
var link = dojo.byId("linkId"); //retrieves a reference to a DOM node with the given id
dojo.connect(link, "onclick", null, function(e){
//do you stuff
});
Here is the doc page of dojo.connect, which also explains how you can clean up event handlers on object destruction / page unload: http://www.dojotoolkit.org/reference-guide/dojo/connect.html
精彩评论