Where I might normally do in HTML:
<a href='...' onclick='alert(123);return
false;'>
I am trying to replicate that with dynamically created tags. I want the href to be valid, but the onclick to return false so that it is executed and the browser does NOT navigate to the href'ed page. I can't manage that though. This creates the link just fine, and opens the window just fine, but it also navigates away from the original page which I want to avoid, when the window is opened.
<!doctype html public "-//W3C//DTD XHTML 1.1//EN" "
http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"
>
<html xmlns="
http://www.w3.org/1999/xhtml"
xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Untitled Page</title>
<style type="text/css">
</style>
<script type="text/javascript">
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
//add event function from
http://www.dynarch.com/projects/calendar/function addAnEvent(aEl, aEvName, aFunc) {
if (aEl.attachEvent) { // IE
aEl.attachEvent("on" + aEvName, aFunc);
} else if (aEl.addEventListener) { // Gecko / W3C
aEl.addEventListener(aEvNa
me, aFunc, true);
} else {
aEl["on" + aEvName] = aFunc;
}
}
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
function elFromEvent(aEvent) {
var el=null;
if (aEvent.target) el=aEvent.target;
if ('undefined'!=typeof event && event.srcElement) el=event.srcElement;
return el;
}
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
function showImage(aEvent) {
var el=elFromEvent(aEvent);
window.open(el.href);
return false;
}
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
//onload handler
addAnEvent(window, 'load', function() {
var a=document.createElement('
a');
a.href='
http://www.google.com/images/logo_sm.gif';
addAnEvent(a, 'click', showImage);
a.appendChild(document.cre
ateTextNod
e('google'
));
document.body.appendChild(
a);
});
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
</script>
</head>
<body>
</body>
</html>
