HTML and CSS Reference
In-Depth Information
}
}
</script>
In this case, when the page loads, I retrieve the link by its ID and then bind a new anony-
mous function to it that calls the original
popup()
function. Instead of hard coding the
URL, I pass
this.href
to the
popup()
function so that it opens the URL in the link.
Using a library like jQuery can make things even easier. Suppose you want any link tag
with the class
popup
to open a new window with the URL associated with the link.
Here's the code:
<script type=“text/javascript”>
$(document).ready(function () {
$(“a.popup”).click(function (event) {
var mywindow = window.open(this.href, 'newwindow',
'height=200,width=400');
event.preventDefault();
});
});
</script>
When the page is ready, I apply the same
onclick
handler to all the links on the page
with the class
popup
. The anonymous event handler opens a new window with the URL
stored in
this.href
, which returns the URL in the link that the user clicked on. It then
calls the
preventDefault()
method on the link, which is a sort of fancy way to return
false provided by jQuery. It's used instead of just returning false because it doesn't dis-
rupt other event handlers that may be fired in addition to this one.
If your head is hurting after this lesson, you're probably not alone. Although the basic
concepts behind the use of frames are relatively straightforward, their implementation is
somewhat harder to come to grips with. As a result, the best way to learn about frames is
by experimenting with them.
In this lesson, you learned how to link a document to a new or existing window. In addi-
tion, you learned how to create framesets and link them together by using the tags listed
in Table 17.5.
