Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > Removing in line javascript events

Reply
Thread Tools

Removing in line javascript events

 
 
m0nkeymafia
Guest
Posts: n/a
 
      06-11-2007
I read about this technique to basically allow you to have a file with
behaviours and javascript events that attach to various dom objects
and events but are not done inline.

so its basically a css file but for javascript.

anyone know what it is called or where i can get more information
about it??

thanks

 
Reply With Quote
 
 
 
 
Darko
Guest
Posts: n/a
 
      06-11-2007
On Jun 11, 3:53 pm, m0nkeymafia <(E-Mail Removed)> wrote:
> I read about this technique to basically allow you to have a file with
> behaviours and javascript events that attach to various dom objects
> and events but are not done inline.
>
> so its basically a css file but for javascript.
>
> anyone know what it is called or where i can get more information
> about it??
>
> thanks


No, the technique looks like the following:
<html>
<script href="events.js"></script>
<body>
<div id="housing">
<!------------------------------------------->
</div>

<div id="humanitarian">
<!------------------------------------------->
</div>
</body>
</html>

// events.js:
document.onload = function()
{
document.getElementById( "housing" ).onclick = function()
{
// ...
}

document.getElementById( "humanitarian" ).onmousemove =
function()
{
// ...
}
}

Does this serve your needs?

 
Reply With Quote
 
 
 
 
Darko
Guest
Posts: n/a
 
      06-11-2007
On Jun 11, 3:53 pm, m0nkeymafia <(E-Mail Removed)> wrote:
> I read about this technique to basically allow you to have a file with
> behaviours and javascript events that attach to various dom objects
> and events but are not done inline.
>
> so its basically a css file but for javascript.
>
> anyone know what it is called or where i can get more information
> about it??
>
> thanks


No, the technique looks like the following:
<html>
<script href="events.js"></script>
<body>
<div id="housing">
<!------------------------------------------->
</div>

<div id="humanitarian">
<!------------------------------------------->
</div>
</body>
</html>

// events.js:
document.onload = function()
{
document.getElementById( "housing" ).onclick = function()
{
// ...
}

document.getElementById( "humanitarian" ).onmousemove = function()
{
// ...
}
}

 
Reply With Quote
 
m0nkeymafia
Guest
Posts: n/a
 
      06-11-2007
On Jun 11, 4:24 pm, Darko <(E-Mail Removed)> wrote:
> On Jun 11, 3:53 pm, m0nkeymafia <(E-Mail Removed)> wrote:
>
> > I read about this technique to basically allow you to have a file with
> > behaviours and javascript events that attach to various dom objects
> > and events but are not done inline.

>
> > so its basically a css file but for javascript.

>
> > anyone know what it is called or where i can get more information
> > about it??

>
> > thanks

>
> No, the technique looks like the following:
> <html>
> <script href="events.js"></script>
> <body>
> <div id="housing">
> <!------------------------------------------->
> </div>
>
> <div id="humanitarian">
> <!------------------------------------------->
> </div>
> </body>
> </html>
>
> // events.js:
> document.onload = function()
> {
> document.getElementById( "housing" ).onclick = function()
> {
> // ...
> }
>
> document.getElementById( "humanitarian" ).onmousemove = function()
> {
> // ...
> }
>
> }


Ah brilliant thanks, is that safe to do [closures etc] ?
Or is it generally a bad technique?

 
Reply With Quote
 
Darko
Guest
Posts: n/a
 
      06-11-2007
On Jun 11, 4:29 pm, m0nkeymafia <(E-Mail Removed)> wrote:
> On Jun 11, 4:24 pm, Darko <(E-Mail Removed)> wrote:
>
>
>
> > On Jun 11, 3:53 pm, m0nkeymafia <(E-Mail Removed)> wrote:

>
> > > I read about this technique to basically allow you to have a file with
> > > behaviours and javascript events that attach to various dom objects
> > > and events but are not done inline.

>
> > > so its basically a css file but for javascript.

>
> > > anyone know what it is called or where i can get more information
> > > about it??

>
> > > thanks

>
> > No, the technique looks like the following:
> > <html>
> > <script href="events.js"></script>
> > <body>
> > <div id="housing">
> > <!------------------------------------------->
> > </div>

>
> > <div id="humanitarian">
> > <!------------------------------------------->
> > </div>
> > </body>
> > </html>

>
> > // events.js:
> > document.onload = function()
> > {
> > document.getElementById( "housing" ).onclick = function()
> > {
> > // ...
> > }

>
> > document.getElementById( "humanitarian" ).onmousemove = function()
> > {
> > // ...
> > }

>
> > }

>
> Ah brilliant thanks, is that safe to do [closures etc] ?
> Or is it generally a bad technique?


Well, it is safe per se, but it is true that programmers are prone to
making mistakes in such contexts, such as not using "this" as they
should. For example, look at the following example, and think what's
the problem with it:

<html>
<script src="events.js"></script>
<body>
<div id="housing">
housing
</div>

<div id="humanitarian">
humanitarian
</div>
</body>
</html>

// events.js:

// instead of creating event handlers on the fly, i.e. in the big
document.onload function, we shall e.g. create an Event Handlers
Factory:
function EventHandlersFactory()
{
// the factory keeps track of how many event handlers it created
so far
this.nrEventHandlers = 0;
}

// the factory has only one method:
EventHandlersFactory.prototype.getEventHandler = function()
{
// it updates the attribute
this.nrEventHandlers++;
// and returns the function that will execute at the specified
moment. It should only alert the ordinal number of the event.
return function()
{
alert( "I am the " + this.nrEventHandlers + ". event handler
created" );
}
}

window.onload = function()
{
alert( "nesto" );
var ehf = new EventHandlersFactory();
document.getElementById( "housing" ).onclick =
ehf.getEventHandler();
document.getElementById( "humanitarian" ).onclick =
ehf.getEventHandler();
}

// question: what happens when you click on the "humanitarian"-box?

// Please note the two minor corrections inhere: it's not
document.onload but window.onload, and it's not <script href=""> but
<script src=""> ... lapsus calami

 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Removing GPO setting from XP machine after removing from Domain Piet Slaghekke Computer Support 4 01-02-2007 08:58 PM
removing a namespace prefix and removing all attributes not in that same prefix Chris Chiasson XML 6 11-14-2006 05:08 PM
How to read a text file line by line and remove some line kaushikshome C++ 4 09-10-2006 10:12 PM
Events Events Events Please Help Chris ASP .Net Web Controls 0 08-30-2005 08:21 PM
Read a file line by line with a maximum number of characters per line Hugo Java 10 10-18-2004 11:42 AM



Advertisments